ajax详解,以及异步JSOP的实现

这里我使用的是jquery的ajax方法   包括三个方法 : get() , post(),   getJson()

get() 和post()的格式我就使用一下格式,很方便:

 $.ajax({
                     url: '地址,
                     type: 'get或post',
                     data: {
                         //这是要传递的参数,根据自己需求填写
                         studentNum:123,
                         classId:1,
                     },
                   //success 方法返回的两个参数,一个是返回的对象,一个是描述状态的字符串,第二个参数一般不用,所以一般就写成
                   //success:function(json)
                     success: function(json, textStatus) {
                         if(json.success) {
                             //操作;
                         } else {
                             alert(json.msg)
                         }
                     },
                     error: function() {
                        //操作
                     }

error 方法返回的参数有三个

error: function (jqXHR, textStatus, errorThrown)

第一个参数 jqXHR jqXHR:这里的jqXHR是一个jqXHR对象,在Jquery1.4和1.4版本之前返回的是XMLHttpRequest对象,1.5版本以后则开始使用jqXHR对象,该对象是一个超集,就是该对象不仅包括XMLHttpRequest对象,还包含其他更多的详细属性和信息。

这里主要有4个属性:

  • readyState :当前状态,0-未初始化,1-正在载入,2-已经载入,3-数据进行交互,4-完成。
  • status  :返回的HTTP状态码,比如常见的404,500等错误代码。
  • statusText :对应状态码的错误信息,比如404错误信息是not found,500是Internal Server Error。
  • responseText :服务器响应返回的文本信息

第二个参数 String textStatus:返回的是字符串类型,表示返回的状态,根据服务器不同的错误可能返回下面这些信息:"timeout"(超时), "error"(错误), "abort"(中止), "parsererror"(解析错误),还有可能返回空值。


第三个参数 String errorThrown:也是字符串类型,表示服务器抛出返回的错误信息,如果产生的是HTTP错误,那么返回的信息就是HTTP状态码对应的错误信息,比如404的Not Found,500错误的Internal Server Error。


接下来就是getJson();

这就是所谓的跨域请求,也就是JSONP;但是JSONP只能是get()请求,把get()请求稍微改动就JSONP了,代码如下:

只变动了两个地方, dataType 和jsonp

    $.ajax({
             type : "GET", //传递参数就是在url后面加上?action=getmsg 等等,参数之间用&隔开  最后还要加上callback=?
             url : "http://active.zol.com.cn/guofeng/profile2.php?action=getmsg&callback=?",             dataType : "jsonp",
            jsonp: 'callback',
             success : function(json){
                 $('#msg_box').html(json.msg);
                            }
         });

另一种就是使用getJson()这个方法。

 $.getJSON("http://active.zol.com.cn/guofeng/profile2.php?callback=?",
    function(data) {
        $('#result').val('My name is: ' + data.nick);
    });

记得在url后面加上?callback=? 原理不必知道,这就是规范,知道这样使用就可以了。

最后补充一点,就是ajax的data的一个参数 async

类型:Boolean

默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。

注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行

一个很使用的例子就是 : 用户点击一个按钮,调用一次ajax请求,那么有的用户会着急的时候会连续点击从而造成不必要的问题,只要把async设置成false就行了,用户不管点击多少次,必须这个请求完成之后才会进行下次请求。

上一篇:如何关闭SELinux


下一篇:如何用正则匹配后缀名不为.jpg, .css, .js, .html, .htm, .png的文件