zepto $.ajax()返回的XHR对象 promise接口总结

时间 2019-12-05

标签 zepto ajax 返回 xhr 对象 promise 接口总结栏目 Ajax 繁體版

原文原文链接

zepto 的promise回调接口一共四个方法，分别是：

xhr.done(function(data, status, xhr){ ... })
xhr.fail(function(xhr, errorType, error){ ... })
xhr.always(function(){ ... })
xhr.then(function(){ ... })

首先，要使用zepto 的promise方法，除了经常使用的 zepto外，必须在其后加载callbacks模块和deferred模块。javascript

而后，就直接上示例代码吧，一目了然，对我来讲也省时间，?css

<body>
<h3>Request</h3>
</body>
<script type="text/javascript" src="lib/zepto1.1.6.js"></script>
<script type="text/javascript" src="lib/callbacks.min.js"></script>
<script type="text/javascript" src="lib/deferred.min.js"></script>
<script>
var send = function () {
  var defer = $.Deferred()
  $.ajax({
    url: '',
    success: function (callback) {
      if (callback.code === 0) {
        defer.resolve(callback)
      } else {
        defer.reject(callback)
      }
    },
    error: function (err) {
      defer.reject(err)
    }
  })
  return defer.promise()
}
document.querySelector('h3').onclick = function () {
  // send().then(function (callback) {  // 接受两个函数，第一个是成功回调，即 defer.resolve(); 第二个是失败回调，即defer.reject()
  //   console.log(callback.message)
  // }, function (err) {
  //   console.log(err)
  // })
  // send().done(function (callback) {  // 接受一个函数，成功回调，即 defer.resolve();
  //   console.log(callback)
  // })
  // send().fail(function (callback) {  // 接受一个函数，失败回调，即 defer.reject();
  //   console.log(callback)
  // })
  send().always(function (callback) {  // 接受的函数个数不限，每一个函数不管是成功回调或失败回调老是执行一个
    console.log(callback, 'success')
  }, function (err) {
    console.log(err, 'err')
  }, function (err) {
    console.log(err, 'err2')
  })
}
</script>

四种回调方法的说明都有注释，都是我本身测试获得的结果。
最后附上 zepto中文版网站java