ajax常见错误和使用总结

先给出标准的js时间ajax


    <script type="txt/javascript">
       
    //1、在IE中实例化Msxml2.XMLHTTP对象  Msxml2.XMLHTTP是IE浏览器的内置对象,该对象具有异步提交数据和获取结果的功能
     
    var  xmlHttp=false;
    function initAJAX()
    {
        if(window.XMLHttpRequset)
         {
             xmlHttp=new XMLHttpRequest();
         }
        else if(window.ActiveXObject)
       {
            try {
                xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
                }
            catch(e){
                  try{
                 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                  }
                catch(e)
                    {
                         window.alert("该浏览器不支持AJAX");
                    }
           }
       }
    }
    //2、指定异步提交的目标和提交方式,调用xmlHttp的open方法true 表示异步请求
     xmlhttp.open("get","info.jsp","true");
    //3、指定当xmlHttp状态改变时,需要进行处理
     
     
    //xmlHttp的状态不断变化,其状态保存在xmlHttp的readyState属性中,用xmlHttp.readyState表示,常见readyState属性如下
    //0:为初始化状态,对象以创建,尚未调用open()
    //1:已初始化状态,调用open()方法以后
    //2:发送数据状态,调用send()方法以后
    //3:数据传送状态,已经接受到部分数据,但接受尚未完成
    //4:完成状态,数据全部接受完成
    xmlHttp.onreadystatechange=function()
    {
       //处理代码
       if(xmlHttp.readyState==4)
        {
             infoDiv.innerHTML=xmlHttp.responseText;
         }
    }
    //还可以infoDiv.innerText中,xmlHttp.responseText表示目标文件得到的输出的文本内容,xmlHttp.responseXml表示提交目标得到的xml格式的数据,
     
     
    //或者xmlHtttp.onreadyStatechange=handle;
      function handle()
    {
       //处理代码
    }
    
    //调用xmlHttp的send函数 如果请求方法是get的话,send可以没有参数,或者参数是null,如果请求方式的post,可以将需要传送的内容传入send函数中以字符串的形式发出,及时是post
    //即使是post提交方式send函数还是可以将参数置空,可以将参数放在url后面进行请求。
     xmlhttp.send();
    </script>


然后我们一般用jquery实现比较多点,这样避免了浏览器不兼容


      $.ajax({
                type: "POST",
                contentType: "application/json",
                url: "WS_Page.asmx/InitList",
                data: "{id:'" + $("#txtId").val() + "',url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",
                datatype: 'json',
                cache: false,
                success: function(json) {
                
                    var objlist = eval(json.d);
                    $.each(objlist, function(n, obj) {
     
                        strhtml += "<tr >";
                        strhtml += "<td>";
                        strhtml += obj.id;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += obj.url;
                        strhtml += "</td";
                        strhtml += "<td>";
                        strhtml += obj.ip;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += obj.updatetime;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += "<input type='button' value='编辑'onclick='javascript:location.href=\"Manager.aspx?id=" + obj.id + "\"'/>  ";
                        strhtml += "<input type='button' value='删除'onclick='deleteInfo(" + obj.id + ")'/>";
                        strhtml += "</td>";
                        strhtml += "</tr>";
                    })      
                    $("#liststr").append(strhtml);
     
                },
                error: function(err) {
                    alert(err.responseText);
                }
            });

当然我们也可以用for循环,但是这个时候的话

 success: function(json){for(var i=0;i<json.length;i++){json.name}}

这样写是错的啊,切记,得不到数据的,忘记了写坐标,下面是对的。

 

 success: function(json){for(var i=0;i<json.length;i++){json[i].name}}

 

不知道大家看到过jquery API 没有


$.ajax()


返回的是xmlRequest对象,已经封装好了,如我们想通过验证 return false 或者 return true 是得不到结果值的,这个原因我看了API才知道

 
比如:

     $.ajax({
                type: "POST",
                contentType: "application/json",
                url: "WS_Page.asmx/InitList",
                data: "{id:'" + $("#txtId").val() + "',url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",
                datatype: 'json',
                cache: false,
                success: function(json) {
                     
                     return false;
     
                },
                error: function(err) {
                    alert(err.responseText);
                }
     });

这样写就错了 因为不会返回 false 可以这么写



    var boo=true;
    $.ajax({
                type: "POST",
                contentType: "application/json",
                url: "WS_Page.asmx/InitList",
                data: "{id:'" + $("#txtId").val() + "',url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",
                datatype: 'json',
                cache: false,
                success: function(json) {
                     
                     boo=false;
     
                },
                error: function(err) {
                    alert(err.responseText);
                }
     });


我们拿到boo的值就可以操作我们相关的函数了。

 

还有拼接字符串的时候

url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",

 

一定要记得加单引号,切记。





作者:chen.yu
深信服三年半工作经验,目前就职游戏厂商,希望能和大家交流和学习,
微信公众号:编程入门到秃头 或扫描下面二维码
零基础入门进阶人工智能(链接)