码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2016-08-14 21:59:59      阅读:151      评论:0      收藏:0      [点我收藏+]

标签:

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

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

    

 1 $.ajax({
 2                     url: ‘地址,
 3                     type: ‘get或post‘,
 4                     data: {
 5                         //这是要传递的参数,根据自己需求填写
 6                         studentNum:123,
 7                         classId:1,
 8                     },
 9                   //success 方法返回的两个参数,一个是返回的对象,一个是描述状态的字符串,第二个参数一般不用,所以一般就写成 
10                   //success:function(json) 
11                     success: function(json, textStatus) {
12                         if(json.success) {
13                             //操作;
14                         } else {
15                             alert(json.msg)
16                         }
17                     },
18                     error: function() {  
19                        //操作
20                     }

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 

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

 

 


 

另一种就是使用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就行了,用户不管点击多少次,必须这个请求完成之后才会进行下次请求。


 

  

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

标签:

原文地址:http://www.cnblogs.com/yalong/p/5770968.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!