ajax简单实例

 

 <script type="text/javascript">
//创建XMLHttpRequest对象
function CreateXMLHttpRequest() {
    var xmlHttp;
    try {
        //firefox,opera 8.0+,safari  
        xmlHttp = new XMLHttpRequest();
    } catch (e) {
        // Internet Explorer  
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                alert("您的浏览器不支持AJAX！");
                return false;
            }
        }
    }
    return xmlHttp;
}

var xmlHttp = CreateXMLHttpRequest();
function CheckUserName() {
//请求路径
    var url = "Server.aspx";
//设置请求参数（准备好请求）
    xmlHttp.open("post", url, true);
//设置XMLHttpRequest对象的回调函数，每次当XMLHttpRequest的readyState属性发生变化时都会触发此事件。
    xmlHttp.onreadystatechange = CheckUserNameResult; 
//发送请求
    xmlHttp.send(null);
}

//Ajax回调函数
function CheckUserNameResult() {
/*
* XMLHttpRequest对象的readyState属性表示服务器对当前http请求的处理状态，有五中状态，状态值和对应的含义如下：
* 0、描述一种"未初始化"状态；此时，已经创建一个XMLHttpRequest对象，但是还没有初始化。
* 1、描述一种"发送"状态；此时，代码已经调用了XMLHttpRequest open()方法并且XMLHttpRequest已经准备好把一个请求发送到服务器。
* 2、描述一种"发送"状态；此时，已经通过send()方法把一个请求发送到服务器端，但是还没有收到一个响应。
* 3、描述一种"正在接收"状态；此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收结束。
* 4、描述一种"已加载"状态；此时，响应已经被完全接收。
*/
    if (xmlHttp.readyState == 4)
    {
/*
* XMLHttpRequest对象的status属性表示http请求状态代码，而且其类型为short。
* 而且，仅当readyState值为3(正在接收中)或4(已加载)时，这个status属性才可用。
* 当readyState的值小于3时试图存取status的值将引发一个异常。
*/
        if (xmlHttp.status == 200)//代码执行状态
        {
            //xmlHttp.responseText用来获取服务器端返回的数据，一般为普通的文本信息——字符串、xml、json字符等。
            //根据服务器端返回的数据，通过js代码定制自己的业务。
            document.getElementById("txt2").value = xmlHttp.responseText;
        }
    }
}
</script>