异步响应状态

使用readyState属性可以实时跟踪异步响应状态。当该属性值发生变化时，会触发readystatechange事件，调用绑定的回调函数。readyState属性值说明如下所示。

• 0：未初始化。表示对象已经建立，但是尚未初始化，尚未调用open()方法。
• 1：初始化。表示对象已经建立，尚未调用send()方法。
• 2：发送数据。表示send()方法已经调用，但是当前的状态及HTTP头未知。
• 3：数据传送中。已经接收部分数据，因为响应及HTTP头不全，这时通过responseBody和responseText获取部分数据会出现错误。
• 4：完成。数据接收完毕，此时可以通过responseBody和responseText获取完整的响应数据。

如果readyState属性值为4，则说明响应完毕，那么就可以安全读取响应的数据。注意，考虑到各种特殊情况，更安全的方法是，同时监测HTTP状态码，只有当HTTP状态码为200时，说明HTTP响应顺利完成。

【示例】以上面示例为例，修改请求为异步响应请求，然后通过status属性获取当前的HTTP状态码。如果readyState属性值为4，且status（状态码）属性值为200，则说明HTTP请求和响应过程顺利完成，这时可以安全、异步的读取数据了。

window.onload =  function(){                      //页面初始化
    var b =  document.getElementsByTagName("input")[0];
    b.onclick = function(){
        var url = "server.php"                  //设置请求的地址
        var xhr = createXHR();                //实例化XMLHttpRequest对象
        xhr.open("POST",url, true);         //建立连接，要求异步响应
         xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');     
                                                               //设置为表单方式提交
        xhr.onreadystatechange = function(){   //绑定响应状态事件监听函数
            if(xhr.readyState == 4){        //监听readyState状态
                if (xhr.status == 200 || xhr.status == 0){       //监听HTTP状态码
                     console.log(xhr.responseText);             //接收数据
                }
            }
        }
         xhr.send("callback=functionName");                  //发送请求
    } 
}