完整的 AJAX 写法(支持多浏览器)

代码如下：

<script type="text/javascript">

    var xmlhttp;
    function Submit() {

        //1.创建 XMLHttpRequest 对象
        if (window.XMLHttpRequest) {

            //IE7,IE8,FireFox,其它
            xmlhttp = new XMLHttpRequest();
            if (xmlhttp.overrideMimeType) {

                //针对某些特定版本的mozillar浏览器的BUG进行修正  
                xmlhttp.overrideMimeType("text/xml");
            }
           
        } else if (window.ActiveXObject) {

            //IE6,IE5.5,IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            
        }
    
    // 简单写法,应该也可以
    //xmlhttp = new XMLHttpRequest()|| new ActiveXObject("Microsoft.XMLHTTP");

        if (xmlhttp == undefined || xmlhttp == null) {
            alert('当前浏览器不支持创建XMLHttpRequest对象,请更换浏览器！');
            return;
        }

        //将每次的状态保存到 数组里
        array.push(xmlhttp.readyState);

        //2.注册回调方法 callback
        xmlhttp.onreadystatechange = callback;

        //获取客户端内容
        var userName = document.getElementById("UserName").value;

        /* 
        //Get 请求方式
        //3.设置和服务端交互的相应参数
        xmlhttp.open("Get", "AjaxRequst.ashx?name="+userName, true);

        //4.设置向服务器发送数据,启动和服务端的交互
        xmlhttp.send();
        */

        //Post 请求方式
        //3.设置和服务端交互的相应参数
        xmlhttp.open("Post", "AjaxRequst.ashx", true);

        //Post方式需要增加的代码
        xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

        //4.设置向服务器发送数据,启动和服务端的交互
        xmlhttp.send("name="+userName);
        
    }

    function callback() {
        //5.判断和服务器端的交互是否完成,还要判断服务端的是否正确返回了数据
        if (xmlhttp.readyState == 4) {
            //表示和服务端的交互已经完成
            if (xmlhttp.status == 200) {
                //表示服务器的响应代码是200,正确的返回数据
                //纯文件数据的接受方法
                var message = xmlhttp.responseText;

                //将返回的内容添加到DIV层里
                var div = document.getElementById('message');
                div.innerHTML = message;

                //XML数据对应的DOM对象的接受方法
                //使用前提是,服务器端需要设置content-type为text/xml
                //var domXml = xmlhttp.responseXML;
                
            }
        }
    }
    
</script>

 

转载于:https://www.cnblogs.com/xgao/p/4156027.html