AJAX

最新推荐文章于 2025-12-05 17:57:22 发布

原创最新推荐文章于 2025-12-05 17:57:22 发布 · 468 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#xmlhttprequest #服务器 #callback #function #ajax #firefox

web前端专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一个使用JavaScript实现的AJAX示例，通过POST方法向服务器发送请求并接收响应。具体展示了如何创建XMLHttpRequest对象，设置请求类型、URL及发送数据的方式，并通过回调函数处理服务器响应。

<script type="text/javascript">
            var xmlHttp;
            function submit()
            {
                if(window.XMLHttpRequest){
                    //alert("IE8,IE7,firefox,chrome,opera");
                    xmlHttp = new XMLHttpRequest();
                    if(xmlHttp.overrideMimeType){
                        xmlHttp.overrideMimeType("text/xml");
                    }
                }
                else if(window.ActiveXObject){
                    //alert("IE6,IE5");
                    var activeName = ["MSXML2.XMLHTTP.6.0","MSXML2.XMLHTTP.5.0",
                        "MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0",
                        "MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
                    for(var i=0;i<activeName.length;i++){
                        try{
                            xmlHttp = new ActiveXObject(activeName[i]);
                            break;
                        }
                        catch(e){
                            
                        }
                    }
                }
                if(xmlHttp == undefined || xmlHttp == null){
                    alert("不支持AJAX");
                    return;
                }
                
                //注册回调方法
                xmlHttp.onreadystatechange = callback;
                //设置服务器端相应的参数
                var username = document.getElementById("UserName").value;
                /*
                //get 方法的使用
                xmlHttp.open("GET","AJAXServer?name="+username,true);
                //设置向服务器端发送的数据，并启动交互
                xmlHttp.send(null);*/
                            
      
                //post 方法 
                xmlHttp.open("POST","AJAXServer",true); 
                xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                xmlHttp.send("name="+username);                
                //回调方法
                function callback(){
                    //判断和服务器端交互是否完成，判断服务器端是否正确返回了数据
                    if(xmlHttp.readyState == 4){
                        //交互已经完成
                       
                        if(xmlHttp.status == 200){
                            //服务器正确
                            var Message = xmlHttp.responseText;
                            //alert(Message);
                            //var domxml = xmlHttp.reponseXML;
                            var div = document.getElementById("message");
                            div.innerHTML = Message;
                        }
                    }
                }
            }
        </script>