jQuery Ajax和$.ajax jqXHR實現教程

 普通的ajax事件，在開發過程中可能已經寫過一個success，在後續的開發中可能我不想動之前寫的success方法，想要重啟一個success比如下面代碼：

代碼如下	複製代碼
$('.btn').click(function () { $.ajax({ type : 'post', url : 'test.php', data : $('form').serialize(), success : function (data) { console.log(data + '1'); }, success : function (data) { console.log(data + '2'); } }); }); 測試結果是： {"user":"admin","email":"1054770532@qq.com"}2

我們發現後面的success方法覆蓋了前面的success方法，測試失敗。那麼有沒有能夠寫多個success的方法呢？既然jquery能在全球廣泛的被採用，這點小需求還是能滿足的，這裡就用到了今天的重點：jqXHR，先看一段代碼瞭解什麼事jqXHR

代碼如下	複製代碼
$('.btn').click(function () { var jqXHR = $.ajax({ type : 'post', url : 'test.php', data : $('form').serialize() }); jqXHR.success(function (data) { console.log(data + '1'); }); jqXHR.success(function (data) { console.log(data + '2'); }); }); 結果如下： {"user":"tuisiyuan","email":"1054770532@qq.com"}1 {"user":"tuisiyuan","email":"1054770532@qq.com"}2

由上我們不難發現所謂的jqXHR不過就是$.ajax的傳回值，而且兩個success方法都被順序的執行了。

隨之jquery版本的改善提高，以後jqXHR可能會棄用success，complete，error方法，而改用done，always，fail方法

代碼如下

複製代碼

$('.btn').click(function () { var jqXHR = $.ajax({ type : 'post', url : 'test.php', data : $('form').serialize() });    //done=>success,always=>complete,fail=>error jqXHR.always(function (data) { console.log('always:' + data); }).done(function (data) { console.log('done:' + data) }); jqXHR.done(function (data) { console.log('done:' + data); }); jqXHR.fail(function (data) { console.log('fail:' + data); }); });

jqXHR可以連綴，執行多個done。