加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

有关 ajax 的知识

发布时间:2020-12-16 03:04:33 所属栏目:百科 来源:网络整理
导读:Ajax的主要作用 Ajax的主要作用是向服务器请求数据的同时无需卸载页面,也就是局部刷新,可以带来了更好的用户体验,同时ajax也有他的不足,比如破坏了浏览器的前进后退按钮,对搜索引擎的支持不足,开发和调试工具缺乏 javascript中的Ajax 在javascript中,

Ajax的主要作用

Ajax的主要作用是向服务器请求数据的同时无需卸载页面,也就是局部刷新,可以带来了更好的用户体验,同时ajax也有他的不足,比如破坏了浏览器的前进后退按钮,对搜索引擎的支持不足,开发和调试工具缺乏

javascript中的Ajax

在javascript中,ajax是通过XMLHttpRequest对象来实现的,这个对象用于和后台进行数据的交互。在ie7之前,XHR是通过MSXML库中的ActiveX对象实现的,ie7后我们可以直接使用 var xhr = new XMLHttpRequest();创建一个XHR对象,创建好之后,我们就可以通过xhr对象来调用相应的方法了。

javascript中Ajax的使用方法

在javascript中,调用Ajax主要分为两步,先open,再send
open指的是开启一个请求,而send负责发送这个请求

  1. open()方法

    xhr.open(‘type‘,‘url‘,true);

    第一个参数是请求类型,get/post
    第二个参数是请求的地址?
    第三个参数表示请求是同步还是异步,true代表异步处理
    注意的一点就是,open方法不会发送请求,只是启动一个请求准备发送

  2. send()方法

    xhr.send(null);

    send方法将请求送给服务器 send方法接受一个参数作为要发送的数据,如果不需要发送数据,参数设为null

  3. 检测响应状态码
    一般请求发送之后,我们可以根据xhr的status属性来判断下一步的操作,status属性会返回一个http状态码
    100-200表示请求已经接受,需要继续处理
    200-300表示请求已被服务器成功接收
    300-400表示重定向,需要客户端采取进一步操作
    400-500表示客户端发生错误, 妨碍了服务器的处理
    500-600表示服务器处理请求的过程发生错误

    `if((xhr.status>=200&&xhr.status<300)||xhr.status==304){ console.log(“request success”); }else{ console.log(“request failed”); } ` 
  4. 检测 readyStatus属性
    发送异步请求的时候,一般要检测xhr的readyState属性,这个属性表示请求过程的当前活动阶段,一共有5个值,0,1,2,3,4
    0代表为初始化,open()未调用
    1代表启动 已调用open,未调用send
    2代表 已经调用send,但还没有接受到响应
    3代表 接受到部分响应数据
    4代表 接受到全部响应数据
    当readyState的值发生变化时,就会触发一次readystatechange事件,用这个事件检测每次状态变化后的值。

var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if(xhr.readyState == 4){ if((xhr.status>=200&&xhr.status<300)||xhr.status==304){ console.log(‘request success‘); }else{ console.log(‘request failed‘); } } } xhr.open(‘get‘,‘test.php‘,true); xhr.send(null); 

get请求和post请求

get请求,常用于向服务器查询某些信息,get可将查询的字符串参数加在url的末尾

xhr.open(‘get‘,‘test.phpname1=value1&name2=value2‘,true); 

post请求,通常用于向服务器发送应该被保存的数据,post请求的主体可以包含格式不限且大量的数据,

xhr.open(‘post‘,‘test.php‘,true); xhr.send(‘name1=value1&name2=value2‘); 

get请求和post请求的区别

  1. get请求会将参数跟在url后进行传递,而post则是作为http消息实体内容发送给服务器

  2. get方式对于传输的数据有大小限制,通常不能大于2kb,而post方式传递的数据量大小没有限制

  3. get方式会将请求的数据会被缓存起来,可以从浏览器的历史记录中读取这些数据,所以会带来一些安全性方面的问题,而post相对来说安全很多

jQuery中的Ajax

javascript的ajax操作比较复杂, jQuery提供了一系列的方法,大大简洁了Ajax开发

1.load()方法

load(url,data,callback);

load方法主要是用来远程载入HTML代码并插入DOM 第一个参数是要访问的HTML的url地址 第二个参数是要发送至服务器的key:value数据 第三个参数是回调函数,需要注意的是:load方法的回调函数无论请求成功或者失败都会执行 load方法的传递方式是根据参数data来自动指定的 $(‘#submit‘).load(‘test.php‘,function(){}); // 无参数传递,get方式 $(‘#submit‘).load(‘test.php‘{name:‘fang‘,age:‘30‘},function(){}); // 有参数传递,post方式 

2.$.get()方法

$.get(url,callback,type)

前两个参数和load方法是一样的 但是回调函数只有在载入成功的时候才会执行 第四个参数是服务器返回的内容格式,如xml,html,json,script,text $.get(‘test.php‘,{ name : ‘fang‘,age : ‘33‘ },function(){ //回调函数 },type) 

3.$.post()方法

$.post(url,type)

前两个参数和load,$.get()方法是一样的 但是回调函数只有在载入成功的时候才会执行 第四个参数是服务器返回的内容格式,如xml,text $.post(‘test.php‘,type) 

4.$.ajax()方法

$.ajax()方法,这是方法不仅可是实现上面的load,$.get(),$.post()方法,而且还可以设定多种状态下的回调函数
$.ajax(options)是jQuery的最底层Ajax实现,这个方法只有一个参数,但是这个参数内包含了所需要的一切信息,参数以key:value形式存在,所有参数都是可选的
$.ajax(url,type,timeout,datatype,beforeSend,complete,success,error,global)这些是所有的参数
url:发送请求的地址
type:请求方式,默认get
timeout:设置请求超时时间
data:发送到服务器的数据
datatype:预期服务器返回的数据类型
beforeSend:发送请求前可以修改XMLHttpRequest对象的函数
complete:请求完成后调用的回调函数
success:请求成功后调用的回调函数
error:请求失败后调用的回调函数
global:表示是否触发全局Ajax事件,默认为true

?



$.ajax({ url:‘test.php‘,type:‘GET‘,datatype:‘json‘,beforeSend:function(){},success:function(){},error:function(){},complete:function(){} })

JQuery 的AJAX方法使用非常的便利,并且提供了一些AJAX的全局方法供调用,合理使用这些方法将会产生非常大的帮助。

所谓全局方法,是指每当调用JQuery的AJAX方法,都会自动调用这些全局方法,以下是JQuery的所有全局方法:

?

?

[html]? view plain ?copy
?
  1. ajaxStart:ajax请求开始前??
  2. ajaxSend:ajax请求时??
  3. ajaxSuccess:ajax获取数据后??
  4. ajaxComplete:ajax请求完成时??
  5. ajaxError:ajax请求发生错误后??
  6. ajaxStop:ajax请求停止后??
  7. Ajax的主要作用是向服务器请求数据的同时无需卸载页面,也就是局部刷新,可以带来了更好的用户体验,同时ajax也有他的不足,比如破坏了浏览器的前进后退按钮,对搜索引擎的支持不足,开发和调试工具缺乏

    javascript中的Ajax

    在javascript中,ajax是通过XMLHttpRequest对象来实现的,这个对象用于和后台进行数据的交互。在ie7之前,XHR是通过MSXML库中的ActiveX对象实现的,ie7后我们可以直接使用 var xhr = new XMLHttpRequest();创建一个XHR对象,创建好之后,我们就可以通过xhr对象来调用相应的方法了。

    javascript中Ajax的使用方法

    在javascript中,调用Ajax主要分为两步,先open,再send
    open指的是开启一个请求,而send负责发送这个请求

    1. open()方法

      xhr.open(‘type‘,true);

      第一个参数是请求类型,get/post
      第二个参数是请求的地址?
      第三个参数表示请求是同步还是异步,true代表异步处理
      注意的一点就是,open方法不会发送请求,只是启动一个请求准备发送

    2. send()方法

      xhr.send(null);

      send方法将请求送给服务器 send方法接受一个参数作为要发送的数据,如果不需要发送数据,参数设为null

    3. 检测响应状态码
      一般请求发送之后,我们可以根据xhr的status属性来判断下一步的操作,status属性会返回一个http状态码
      100-200表示请求已经接受,需要继续处理
      200-300表示请求已被服务器成功接收
      300-400表示重定向,需要客户端采取进一步操作
      400-500表示客户端发生错误, 妨碍了服务器的处理
      500-600表示服务器处理请求的过程发生错误

      `if((xhr.status>=200&&xhr.status<300)||xhr.status==304){ console.log(“request success”); }else{ console.log(“request failed”); } ` 
    4. 检测 readyStatus属性
      发送异步请求的时候,一般要检测xhr的readyState属性,这个属性表示请求过程的当前活动阶段,一共有5个值,0,但还没有接受到响应
      3代表 接受到部分响应数据
      4代表 接受到全部响应数据
      当readyState的值发生变化时,就会触发一次readystatechange事件,用这个事件检测每次状态变化后的值。

    var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if(xhr.readyState == 4){ if((xhr.status>=200&&xhr.status<300)||xhr.status==304){ console.log(‘request success‘); }else{ console.log(‘request failed‘); } } } xhr.open(‘get‘,true); xhr.send(null); 

    get请求和post请求

    get请求,常用于向服务器查询某些信息,get可将查询的字符串参数加在url的末尾

    xhr.open(‘get‘,true); 

    post请求,通常用于向服务器发送应该被保存的数据,post请求的主体可以包含格式不限且大量的数据,

    xhr.open(‘post‘,true); xhr.send(‘name1=value1&name2=value2‘); 

    get请求和post请求的区别

    1. get请求会将参数跟在url后进行传递,而post则是作为http消息实体内容发送给服务器

    2. get方式对于传输的数据有大小限制,通常不能大于2kb,而post方式传递的数据量大小没有限制

    3. get方式会将请求的数据会被缓存起来,可以从浏览器的历史记录中读取这些数据,所以会带来一些安全性方面的问题,而post相对来说安全很多

    jQuery中的Ajax

    javascript的ajax操作比较复杂, jQuery提供了一系列的方法,大大简洁了Ajax开发

    1.load()方法

    load(url,callback);

    load方法主要是用来远程载入HTML代码并插入DOM 第一个参数是要访问的HTML的url地址 第二个参数是要发送至服务器的key:value数据 第三个参数是回调函数,需要注意的是:load方法的回调函数无论请求成功或者失败都会执行 load方法的传递方式是根据参数data来自动指定的 $(‘#submit‘).load(‘test.php‘,function(){}); // 有参数传递,post方式 

    2.$.get()方法

    $.get(url,type)

    前两个参数和load方法是一样的 但是回调函数只有在载入成功的时候才会执行 第四个参数是服务器返回的内容格式,如xml,type) 

    3.$.post()方法

    $.post(url,type)

    前两个参数和load,type) 

    4.$.ajax()方法

    $.ajax()方法,这是方法不仅可是实现上面的load,global)这些是所有的参数
    url:发送请求的地址
    type:请求方式,默认get
    timeout:设置请求超时时间
    data:发送到服务器的数据
    datatype:预期服务器返回的数据类型
    beforeSend:发送请求前可以修改XMLHttpRequest对象的函数
    complete:请求完成后调用的回调函数
    success:请求成功后调用的回调函数
    error:请求失败后调用的回调函数
    global:表示是否触发全局Ajax事件,默认为true

    ?



    $.ajax({ url:‘test.php‘,complete:function(){} })

    JQuery 的AJAX方法使用非常的便利,并且提供了一些AJAX的全局方法供调用,合理使用这些方法将会产生非常大的帮助。

    所谓全局方法,是指每当调用JQuery的AJAX方法,都会自动调用这些全局方法,以下是JQuery的所有全局方法:

    ?

    ?

    [html]? view plain ?copy
    ?
    1. ajaxStart:ajax请求开始前??
    2. ajaxSend:ajax请求时??
    3. ajaxSuccess:ajax获取数据后??
    4. ajaxComplete:ajax请求完成时??
    5. ajaxError:ajax请求发生错误后??
    6. ajaxStop:ajax请求停止后??
    7. ajax请求中的6个全局事件

      ?

      //事件触发顺序ajaxStart,ajaxSend,ajaxSuccess或ajaxError,ajaxComplete,ajaxStop
      
      $(document).ajaxStart(function (event) {
          /*
           * 每一个ajax即将发送的时候触发该事件,只有一个事件对象参数
           */
          console.log(‘ajaxStart‘);
      })
      
      $(document).ajaxSend(function (event,xhr,opts,err) {
          /*
           * 每一个ajax即将发送的时候触发该事件
           * 此方法接受四个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象,错误信息
           */
          if(opts.type == ‘get‘){
              xhr.abort();
          }    
      })
      
      $(document).ajaxSuccess(function (event,opts) {
          /*
           * 此方法接受三个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象
           * 每一个ajax请求成功都会触发该事件
           * 配置对象中的success回调会先执行,然后再执行这个事件
           */
          console.log(JSON.parse(xhr.responseText))
      })
      
      $(document).ajaxError(function (event,err) {
          /*
           * 此方法接受四个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象,错误信息
           * 每一个ajax请求失败都会触发该事件
           * 配置对象中的error回调会先执行,然后再执行这个事件
           * 如果是客户端错误导致请求失败,err的值有可能是timeout,abort,或者是抛出错误异常对象
           */
          console.log(err)
      })
      
      $(document).ajaxComplete(function (event,opts) {
          /*
           * 此方法接受三个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象
           * 每一个ajax请求完成都会触发该事件,不管请求的结果如何
           * 配置对象中的complete回调会先执行,然后再执行这个事件
           */
      })
      
      $(document).ajaxStop(function (event) {
          /*
           * 此方法只接受一个事件对象参数,此事件只触发一次
           * 当所有ajax请求完成的时候调用一次,不管ajax请求的状态是失败还是成功或是被取消
           */
      })

      ?注意:ajaxStart和ajaxSend事件必须放在ajax请求代码之前,不然不会触发

      jquery中的ajax方法参数总是记不住,这里记录一下。

      ?

      1.url:?
      要求为String类型的参数,(默认为当前页地址)发送请求的地址。

      2.type:?
      要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。

      3.timeout:?
      要求为Number类型的参数,设置请求超时时间(毫秒)。此设置将覆盖$.ajaxSetup()方法的全局设置。

      4.async:?
      要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为false。注意,同步请求将锁住浏览器,用户其他操作必须等待请求完成才可以执行。

      5.cache:?
      要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false),设置为false将不会从浏览器缓存中加载请求信息。

      6.data:?
      要求为Object或String类型的参数,发送到服务器的数据。如果已经不是字符串,将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换,可以查看  processData选项。对象必须为key/value格式,例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组,JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。

      7.dataType:?
      要求为String类型的参数,预期服务器返回的数据类型。如果不指定,JQuery将自动根据http包mime信息返回responseXML或responseText,并作为回调函数参数传递。可用的类型如下:
      xml:返回XML文档,可用JQuery处理。
      html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。
      script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时(不在同一个域下),所有post请求都将转为get请求。
      json:返回JSON数据。
      jsonp:JSONP格式。使用SONP形式调用函数时,例如myurl?callback=?,JQuery将自动替换后一个“?”为正确的函数名,以执行回调函数。
      text:返回纯文本字符串。

      8.beforeSend
      要求为Function类型的参数,发送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参数。
      ??????????? function(XMLHttpRequest){
      ?????????????? this;?? //调用本次ajax请求时传递的options参数
      ??????????? }
      9.complete
      要求为Function类型的参数,请求完成后调用的回调函数(请求成功或失败时均调用)。参数:XMLHttpRequest对象和一个描述成功请求类型的字符串。
      ????????? function(XMLHttpRequest,textStatus){
      ???????????? this;??? //调用本次ajax请求时传递的options参数
      ????????? }

      10.success:要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。
      ???????? (1)由服务器返回,并根据dataType参数进行处理后的数据。
      ???????? (2)描述状态的字符串。
      ???????? function(data,textStatus){
      ??????????? //data可能是xmlDoc、jsonObj、html、text等等
      ??????????? this;? //调用本次ajax请求时传递的options参数
      ???????? }

      11.error:
      要求为Function类型的参数,请求失败时被调用的函数。该函数有3个参数,即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下:
      ?????? function(XMLHttpRequest,textStatus,errorThrown){
      ????????? //通常情况下textStatus和errorThrown只有其中一个包含信息
      ????????? this;?? //调用本次ajax请求时传递的options参数
      ?????? }

      12.contentType
      要求为String类型的参数,当发送信息至服务器时,内容编码类型默认为"application/x-www-form-urlencoded"。该默认值适合大多数应用场合。

      13.dataFilter
      要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
      ??????????? function(data,type){
      ??????????????? //返回处理后的数据
      ??????????????? return data;
      ??????????? }

      14.dataFilter
      要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
      ??????????? function(data,type){
      ??????????????? //返回处理后的数据
      ??????????????? return data;
      ??????????? }

      15.global
      要求为Boolean类型的参数,默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局ajax事件,ajaxStart或ajaxStop可用于控制各种ajax事件。

      16.ifModified
      要求为Boolean类型的参数,默认为false。仅在服务器数据改变时获取新数据。服务器数据改变判断的依据是Last-Modified头信息。默认值是false,即忽略头信息。

      17.jsonp
      要求为String类型的参数,在一个jsonp请求中重写回调函数的名字。该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,例如{jsonp:‘onJsonPLoad‘}会导致将"onJsonPLoad=?"传给服务器。

      18.username
      要求为String类型的参数,用于响应HTTP访问认证请求的用户名。

      19.password
      要求为String类型的参数,用于响应HTTP访问认证请求的密码。

      20.processData
      要求为Boolean类型的参数,默认为true。默认情况下,发送的数据将被转换为对象(从技术角度来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM树信息或者其他不希望转换的信息,请设置为false。

      21.scriptCharset
      要求为String类型的参数,只有当请求时dataType为"jsonp"或者"script",并且type是GET时才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。

      案例代码:

      $(function(){
          $(‘#send‘).click(function(){
               $.ajax({
                   type: "GET",url: "test.json",data: {username:$("#username").val(),content:$("#content").val()},dataType: "json",success: function(data){
                               $(‘#resText‘).empty();   //清空resText里面的所有内容
                               var html = ‘‘; 
                               $.each(data,function(commentIndex,comment){
                                     html += ‘<div class="comment"><h6>‘ + comment[‘username‘]
                                               + ‘:</h6><p class="para"‘ + comment[‘content‘]
                                               + ‘</p></div>‘;
                               });
                               $(‘#resText‘).html(html);
                            }
               });
          });
      });

      ?

      22.顺便说一下$.each()函数:
      $.each()函数不同于JQuery对象的each()方法,它是一个全局函数,不操作JQuery对象,而是以一个数组或者对象作为第1个参数,以一个回调函数作为第2个参数。回调函数拥有两个参数:第1个为对象的成员或数组的索引,第2个为对应变量或内容。

      ?

      jQuery.ajaxSetup() 函数详解

      可以参考这篇:http://www.365mini.com/page/jquery_ajaxsetup.htm

      链接2:http://www.voidcn.com/article/p-rjjkiink-bao.html

      不过要注意:如果用户在自己的ajax定义了和全局ajaxSetup一样的属性,则用户定义的属性会覆盖全局默认的属性。如用户自己定义了属性error,ajaxSetup也定义了error,出现error时,会走用户自定义的error,不会走ajaxSetup的error。

      如果你想写一遍ajaxSetup,让其他页面都支持这个功能,可以这样做:

      写一个js,让替他页面引入这个js就行了。如写ajaxSetup.js,ajaxSetup.js里内容

      ?

      [html]? view plain ?copy
      ?
      1. $(function(){??
      2. ????$.ajaxSetup(?{??
      3. ????????url:?"/index.html"?,?//?默认URL??
      4. ????????aysnc:?false?,?//?默认同步加载??
      5. ????????type:?"POST"?,?//?默认使用POST方式??
      6. ????????headers:?{?//?默认添加请求头??
      7. ????????????"Author":?"CodePlayer"?,??
      8. ????????????"Powered-By":?"CodePlayer"??
      9. ????????}?,??
      10. ????????error:?function(jqXHR,?textStatus,?errorMsg){?//?出错时默认的处理函数??
      11. ????????????//?jqXHR?是经过jQuery封装的XMLHttpRequest对象??
      12. ????????????//?textStatus?可能为:?null、"timeout"、"error"、"abort"或"parsererror"??
      13. ????????????//?errorMsg?可能为:?"Not?Found"、"Internal?Server?Error"等??
      14. ??
      15. ????????????//?提示形如:发送AJAX请求到"/index.html"时出错[404]:Not?Found??
      16. ?????????????
      17. ????????????if?(jqXHR.status==500)?{??
      18. ?????????????????alert(?‘出错[‘?+?jqXHR.status?+?‘]:‘?+?errorMsg+‘:::‘+jqXHR.responseText?);????
      19. ????????????}??
      20. ????????????if?(jqXHR.status==404)?{??
      21. ????????????????alert(?‘出错[‘?+?jqXHR.status?+?‘]:‘?+?errorMsg+‘:::‘+jqXHR.responseText?);????
      22. ????????????}??
      23. ??????????????
      24. ????????}??
      25. ????}?);??
      26. });??
      然后别的页面引入这个js就行了。

      jQuery.ajaxSetup()函数用于设置AJAX的全局默认设置。

      该函数用于更改jQuery中AJAX请求的默认设置选项。之后执行的所有AJAX请求,如果对应的选项参数没有设置,将使用更改后的默认设置。

      该函数属于全局jQuery对象。

      语法

      jQuery?1.1 新增该静态函数。

      ?

      [html]? view plain ?copy
      ?
      1. jQuery.ajaxSetup(?settings?)??

      参数

      参数 描述
      settings Object类型一个对象,其中的每个属性表示需要更改默认设置的选项,属性值表示更改后的默认值。

      关于settings参数可以识别的属性,请参考jQuery.ajax()中的settings参数说明。其中的所有选项参数都是可选设置的。

      返回值

      jQuery.ajaxSetup()函数没有返回值,或者说其返回值为undefined

      源码中其实最主要的是通过设置这个:$.ajaxSettings.cache=false;

      示例&说明

      以下是与jQuery.ajaxSetup()函数相关的jQuery示例代码,以演示jQuery.ajaxSetup()函数的具体用法:

      ?

      [html]? view plain ?copy
      ?
      1. //设置AJAX的全局默认选项??
      2. $.ajaxSetup(?{??
      3. ????url:?"/index.html"?,?//?默认URL??
      4. ????aysnc:?false?,?//?默认同步加载??
      5. ????type:?"POST"?,?//?默认使用POST方式??
      6. ????headers:?{?//?默认添加请求头??
      7. ????????"Author":?"CodePlayer"?,??
      8. ????????"Powered-By":?"CodePlayer"??
      9. ????}?,??
      10. ????error:?function(jqXHR,?errorMsg){?//?出错时默认的处理函数??
      11. ????????//?jqXHR?是经过jQuery封装的XMLHttpRequest对象??
      12. ????????//?textStatus?可能为:?null、"timeout"、"error"、"abort"或"parsererror"??
      13. ????????//?errorMsg?可能为:?"Not?Found"、"Internal?Server?Error"等??
      14. ??
      15. ????????//?提示形如:发送AJAX请求到"/index.html"时出错[404]:Not?Found??
      16. ????????alert(?‘发送AJAX请求到"‘?+?this.url?+?‘"时出错[‘?+?jqXHR.status?+?‘]:‘?+?errorMsg?);??????????
      17. ????}??
      18. }?);??
      19. ??
      20. ??
      21. //?未设置任何参数,但url、async、type、headers、error等参数的默认值均已被$.ajaxSetup()更改(如上)??
      22. $.ajax(?);??
      23. ??
      24. ??
      25. //?设置了url、type、success、error,就使用自己设置的参数值??
      26. //?但async、headers等参数的默认值已被$.ajaxSetup()更改??
      27. $.ajax(?{??
      28. ????url:?"myurl.php?action=list"?,??
      29. ????type:?"GET"?,??
      30. ????success:?function(?data,?jqXHR?){??
      31. ????????alert("返回数据:"?+?data);??
      32. ????}?,??
      33. ????error:?function(jqXHR,?errorMsg){??
      34. ????????alert("自己的error!");??????????
      35. ????}??
      36. });??
      37. ??
      38. //?上述$.ajaxSetup()的默认设置对$.get()、$.post()、load()、$.getJSON()、$.getScript()等AJAX函数也生效??
      39. //?因为这些函数也是在内部调用$.ajax()函数来实现的,只不过它们在内部都设置了一些参数??
      40. ??
      41. ??
      42. //?$.get()在内部调用$.ajax()时已设置type为"GET",因此仍然使用GET方式。??
      43. //?但url、async、headers、error等参数的默认值已被$.ajaxSetup()更改??
      44. $.get(?);??
      45. ??
      46. ??
      47. //?$.post()在内部调用$.ajax()时已设置type为"POST",因此仍然使用POST方式。??
      48. //?url也被设置为"user/action.php?method=addUser"??
      49. //?但async、headers、error等参数的默认值已被$.ajaxSetup()更改??
      50. $.post(?"user/action.php?method=addUser"?);??
时间:2018-06-02 11:22:22 阅读(31)

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读