jQuery.ajax 处理继续响应:“成功:"与“.完成"?
我已经使用 jQuery 和 AJAX 工作了几个星期,我看到两种不同的方法在调用后继续"脚本:success:
和 .done
.
I have been working with jQuery and AJAX for a few weeks now and I saw two different ways to 'continue' the script once the call has been made: success:
and .done
.
从 jQuery 文档的概要我们得到:
.done(): 说明:添加处理 Deferred 对象时调用的处理程序.
.done(): Description: Add handlers to be called when the Deferred object is resolved.
success: (.ajax() option): 请求成功时调用的函数.
success: (.ajax() option): A function to be called if the request succeeds.
因此,在 AJAX 调用完成/解决后,两者都做一些事情.我可以随意使用一个或另一个吗?有什么区别?什么时候用一个而不是另一个?
So, both do something after the AJAX call has been completed/resolved. Can I use one or the other randomly? What is the difference and when one is used instead of the other?
success
一直是 jQuery 中成功回调的传统名称,定义为 ajax 调用中的一个选项.然而,由于 $.Deferreds
和更复杂的回调的实现,done
是实现成功回调的首选方式,因为它可以在任何 deferred代码>.
success
has been the traditional name of the success callback in jQuery, defined as an option in the ajax call. However, since the implementation of $.Deferreds
and more sophisticated callbacks, done
is the preferred way to implement success callbacks, as it can be called on any deferred
.
例如,成功:
$.ajax({
url: '/',
success: function(data) {}
});
例如完成:
$.ajax({url: '/'}).done(function(data) {});
done
的好处是 $.ajax
的返回值现在是一个延迟承诺,可以绑定到应用程序中的任何其他地方.因此,假设您想从几个不同的地方进行这个 ajax 调用.而不是将您的成功函数作为选项传递给进行此 ajax 调用的函数,您可以让函数返回 $.ajax
本身并使用 done
绑定您的回调、fail
、then
或其他.请注意,always
是一个回调,无论请求成功还是失败都会运行.done
只会在成功时触发.
The nice thing about done
is that the return value of $.ajax
is now a deferred promise that can be bound to anywhere else in your application. So let's say you want to make this ajax call from a few different places. Rather than passing in your success function as an option to the function that makes this ajax call, you can just have the function return $.ajax
itself and bind your callbacks with done
, fail
, then
, or whatever. Note that always
is a callback that will run whether the request succeeds or fails. done
will only be triggered on success.
例如:
function xhr_get(url) {
return $.ajax({
url: url,
type: 'get',
dataType: 'json',
beforeSend: showLoadingImgFn
})
.always(function() {
// remove loading image maybe
})
.fail(function() {
// handle request failures
});
}
xhr_get('/index').done(function(data) {
// do stuff with index data
});
xhr_get('/id').done(function(data) {
// do stuff with id data
});
这在可维护性方面的一个重要好处是您已将 ajax 机制包装在特定于应用程序的函数中.如果您决定将来需要 $.ajax
调用以不同方式操作,或者您使用不同的 ajax 方法,或者您不再使用 jQuery,则只需更改 xhr_get
定义(确保返回一个承诺或至少一个 done
方法,在上面的例子中).整个应用程序中的所有其他引用都可以保持不变.
An important benefit of this in terms of maintainability is that you've wrapped your ajax mechanism in an application-specific function. If you decide you need your $.ajax
call to operate differently in the future, or you use a different ajax method, or you move away from jQuery, you only have to change the xhr_get
definition (being sure to return a promise or at least a done
method, in the case of the example above). All the other references throughout the app can remain the same.
你可以用 $.Deferred
做更多(更酷)的事情,其中之一是使用 pipe
来触发失败报告的错误服务器,即使 $.ajax
请求本身成功.例如:
There are many more (much cooler) things you can do with $.Deferred
, one of which is to use pipe
to trigger a failure on an error reported by the server, even when the $.ajax
request itself succeeds. For example:
function xhr_get(url) {
return $.ajax({
url: url,
type: 'get',
dataType: 'json'
})
.pipe(function(data) {
return data.responseCode != 200 ?
$.Deferred().reject( data ) :
data;
})
.fail(function(data) {
if ( data.responseCode )
console.log( data.responseCode );
});
}
xhr_get('/index').done(function(data) {
// will not run if json returned from ajax has responseCode other than 200
});
在此处阅读有关 $.Deferred
的更多信息:http://api.jquery.com/category/deferred-object/
Read more about $.Deferred
here: http://api.jquery.com/category/deferred-object/
注意:从 jQuery 1.8 开始,pipe
已被弃用,而是以完全相同的方式使用 then
.
NOTE: As of jQuery 1.8, pipe
has been deprecated in favor of using then
in exactly the same way.