温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

jQuery中$.ajax()提供的回调钩子是什么

发布时间:2022-03-05 11:21:06 来源:亿速云 阅读:291 作者:小新 栏目:web开发

这篇文章主要介绍了jQuery中$.ajax()提供的回调钩子是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

  Callback Function Queues(回调函数)

  beforeSend, error, dataFilter, success 和 complete接受的回调函数是在合适的时间调用。

  从jQuery 1.5开始, fail , done ,和从jQuery 1.6开始的always回调钩子(hooks)采用先入先出队列管理。这意味着你可以为每个挂钩分配多个回调。见Deferred object methods ,这是实现内部的$.ajax()回调钩子(hooks)。

  这里有$.ajax()提供的回调钩子 (hooks),如下:

  beforeSend 在发送请求之前调用,它接收jqXHR对象和settings作为参数对象。

  error 在请求出错时调用。如果请求失败,在它们的顺序依次登记。他们接受jqXHR ,字符串表示的错误类型,以及异常对象(如果有的话)。一些内置的错误会将 "abort", "timeout", "No Transport" 等字符串作为异常对象。

  dataFilter 在请求成功之后调用。传入返回的数据以及dataType参数的值。并且必须返回新的数据(可能是处理过的)传递给success回调函数。

  success 当请求成功并接收到返回数据之后调用。传入返回后的数据,以及包含成功代码的字符串和jqXHR对象。

  complete 请求完成时,无论是在失败或成功,它们按顺序依次执行回调。他们收到jqXHR对象,以及一个包含成功或错误代码。

  Data Types(数据类型)

  $.ajax()函数依赖服务器提供的信息来处理返回的数据。如果服务器报告说返回的数据是XML,那么返回的结果就可以用普通的XML方法或者jQuery的选择器来遍历。如果见得到其他类型,比如HTML,则数据就以文本形式来对待。

  通过dataType选项还可以指定其他不同数据处理方式。除了单纯的xml,dataType还可以指定 html, json, jsonp, script, 或者 text。

  其中,text 和 xml类型返回的数据不会经过处理。无论是通过jqXHR对象的responseText或responseXML,这些数据仅仅是传递给处理程序的成功

  注意:我们必须确保网页服务器报告的MIME类型与我们选择的 dataType. 所匹配。比如说,XML的话,服务器端就必须声明 text/xml 或者 application/xml 来获得一致的结果。

  如果指定为 html类型,任何内嵌的JavaScript都会在HTML作为一个字符串返回之前执行。类似的,指定script类型的话,也会先执行服务器端生成JavaScript,然后再把脚本作为一个文本数据返回。

  如果指定为json类型,则会把获取到的数据作为一个JavaScript对象来解析,并且把构建好的对象作为结果返回。为了实现这个目的,他首先尝试使用jQuery.parseJSON()。如果浏览器不支持,则使用一个Function来constructor。畸形的JSON数据将抛出一个解析错误(查看json.org了解更多信息)。JSON数据是一种能很方便通过JavaScript解析的结构化数据。如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型代替。

  jsonp类型会给请求的URL后面创建一个查询字符串参数 callback=? 。服务器端应当在JSON数据前加上回调函数名,以便完成一个有效的JSONP请求。如果要指定回调函数的参数名来取代默认的callback,可以通过设置$.ajax()的jsonp参数。

  注意:JSONP是JSON格式的扩展。他要求一些服务器端的代码来检测并处理查询字符串参数。更多信息可以参阅详细介绍了其使用的原帖.

  当数据被从远程服务器取回(这是唯一可能使用script 或者 jsonp数据类型),error回调和全局事件将永远不会被触发。

  注:如果指定了script或者jsonp类型,那么当从服务器接收到数据时,实际上是用了<script>标签而不是XMLHttpRequest对象。这种情况下,$.ajax()不再返回一个XMLHttpRequest对象,并且也不会传递事件处理函数,比如beforeSend。

  Sending Data to the Server(发送数据到服务器)

  默认情况下,Ajax请求使用GET方法。如果要使用POST方法,可以设定type参数值。这个选项也会影响 data 选项中的内容如何发送到服务器。POST数据将被发送到服务器使用UTF-8字符集,根据W3C XMLHttpRequest的标准。

  data选项既可以包含一个查询字符串,比如 key1=value1&key2=value2,也可以是一个映射,比如 {key1: 'value1', key2: 'value2'} 。如果使用了后者的形式,则数据再发送前会用jQuery.param() 将其转换成查询字符串。这个处理过程也可以通过设置processData选项为false来回避。如果我们希望发送一个XML对象给服务器时,这种处理可能并不合适。并且在这种情况下,我们也应当改变contentType 选项的值,用其他合适的MIME类型来取代默认的  application/x-www-form-urlencoded 。

  Advanced Options(高级选项)

  global选项用于阻止响应注册的回调函数,比如.ajaxSend(), .ajaxError(),以及类似的方法。这在有些时候很有用,比如发送的请求非常频繁且简短的时候,就可以在.ajaxSend()里禁用这个。跨域脚本和JSONP请求,全局选项自动设置为false。更多关于这些方法的详细信息,请参阅下面的内容。

  如果服务器需要HTTP认证,可以使用用户名和密码可以通过 username 和 password 选项来设置。

  Ajax请求是限时的,所以错误警告被捕获并处理后,可以用来提升用户体验。请求超时这个参数通常就保留其默认值,要不就通过$.ajaxSetup()来全局设定,很少为特定的请求重新设置timeout选项。

  默认情况下,请求总会被发出去,但浏览器有可能从他的缓存中调取数据。要禁止使用缓存的结果,可以设置cache参数为false。如果希望判断数据自从上次请求后没有更改过就报告出错的话,可以设置ifModified为true。

  scriptCharset允许给<script>标签的请求设定一个特定的字符集,用于script 或者 jsonp类似的数据。当脚本和页面字符集不同时,这特别好用。

  Ajax的第一个字母是“asynchronous”的开头字母,这意味着所有的操作都是并行的,完成的顺序没有前后关系。$.ajax()的async参数总是设置成true,这标志着在请求开始后,其他代码依然能够执行。强烈不建议把这个选项设置成false,这意味着所有的请求都不再是异步的了,这也会导致浏览器被锁死。

  $.ajax()函数返回他创建的XMLHttpRequest对象。通常jQuery只在内部处理并创建这个对象,但用户也可以通过xhr 选项来传递一个自己创建的xhr对象。返回的对象通常已经被丢弃了,但依然提供一个底层接口来观察和操控请求。比如说,调用对象上的.abort() 可以在请求完成前挂起请求。

  目前, 在Firefox中有一个bug,虽然.getResponseHeader('Content-Type')返回一个非空的字符串,但是 .getAllResponseHeaders()还是返回空字符串, 在Firefox中使用jQuery不支持自动解码JSON CORS 响应。

  重写jQuery.ajaxSettings.xhr 的一种解决方案,如下

  (function () {

  var _super = jQuery.ajaxSettings.xhr,

  xhrCorsHeaders = [ "Cache-Control", "Content-Language", "Content-Type", "Expires", "Last-Modified", "Pragma" ];

  jQuery.ajaxSettings.xhr = function () {

  var xhr = _super(),

  getAllResponseHeaders = xhr.getAllResponseHeaders;

  xhr.getAllResponseHeaders = function () {

  var allHeaders = "";

  try {

  allHeaders = getAllResponseHeaders.apply( xhr );

  if ( allHeaders ) {

  return allHeaders;

  }

  } catch ( e ) {

  }

  $.each( xhrCorsHeaders, function ( i, headerName ) {

  if ( xhr.getResponseHeader( headerName ) ) {

  allHeaders += headerName + ": " + xhr.getResponseHeader( headerName ) + "\n";

  }

  });

  return allHeaders;

  };

  return xhr;

  };

  })();

感谢你能够认真阅读完这篇文章,希望小编分享的“jQuery中$.ajax()提供的回调钩子是什么”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI