jQuery ajax成功回調函數定義

Question

我想使用jQuery ajax從服務器檢索數據。

我想將成功回調函數定義放在.ajax()塊之外，如下所示。 那么我需要像下面這樣聲明變量dataFromServer ，以便我能夠使用成功回調中返回的數據嗎？

我見過大多數人在.ajax()塊中定義成功回調。 如果我想在外面定義成功回調，那么以下代碼是否正確？

var dataFromServer;  //declare the variable first

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData(dataFromServer)
    })
}

function handleData(data) {
    alert(data);
    //do some stuff
}

Answer 1

自jQuery 1.5（2011年1月）以來這樣做的“新”方法是使用延遲對象而不是傳遞success回調。 您應該返回 $.ajax的結果，然后使用.done ， .fail等方法在$.ajax調用之外添加回調。

function getData() {
    return $.ajax({
        url : 'example.com',
        type: 'GET'
    });
}

function handleData(data /* , textStatus, jqXHR */ ) {
    alert(data);
    //do some stuff
}

getData().done(handleData);

這將回調處理與AJAX處理分離，允許您添加多個回調，故障回調等，而無需修改原始的getData()函數。 將AJAX功能與之后要完成的操作集分開是一件好事！ 。

延遲還允許更容易同步多個異步事件，這些事件只有success:才能輕松完成success:

例如，我可以添加多個回調，一個錯誤處理程序，並在繼續之前等待計時器過去：

// a trivial timer, just for demo purposes -
// it resolves itself after 5 seconds
var timer = $.Deferred();
setTimeout(timer.resolve, 5000);

// add a done handler _and_ an `error:` handler, even though `getData`
// didn't directly expose that functionality
var ajax = getData().done(handleData).fail(error);

$.when(timer, ajax).done(function() {
    // this won't be called until *both* the AJAX and the 5s timer have finished
});

ajax.done(function(data) {
    // you can add additional callbacks too, even if the AJAX call
    // already finished
});

jQuery的其他部分也使用延遲對象 - 您可以非常輕松地將jQuery動畫與其他異步操作同步。

Answer 2

只需使用：

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

success屬性僅需要對函數的引用，並將數據作為參數傳遞給此函數。

由於handleData的聲明方式，您可以像這樣訪問handleData函數。 JavaScript將在運行之前解析代碼以獲取函數聲明，因此您將能夠在實際聲明之前的代碼中使用該函數。 這被稱為吊裝 。

但是，這不會計入這樣聲明的函數：

var myfunction = function(){}

這些僅在口譯員通過時才可用。

有關聲明函數的兩種方法的詳細信息，請參閱此問題

Answer 3

我不知道你為什么要在腳本之外定義參數。 這是不必要的。 將使用返回數據作為參數自動調用您的回調函數。 很有可能在sucess:之外定義你的回調sucess:即

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

function handleData(data) {
    alert(data);
    //do some stuff
}

將調用handleData函數並通過ajax函數將參數傳遞給它。

Answer 4

嘗試將您的成功處理程序重寫為：

success : handleData

ajax方法的success屬性只需要引用一個函數。

在handleData函數中，您最多可以使用3個參數：

object data
string textStatus
jqXHR jqXHR

Answer 5

我會寫：

var handleData = function (data) {
    alert(data);
    //do some stuff
}


function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

Answer 6

幾個小時后玩它幾乎變得沉悶。 奇跡來找我，它的工作。

<pre>


var listname = [];   


 $.ajax({
    url : wedding, // change to your local url, this not work with absolute url
    success: function (data) {
       callback(data);
    }
});

function callback(data) {
      $(data).find("a").attr("href", function (i, val) {
            if( val.match(/\.(jpe?g|png|gif)$/) ) { 
             //   $('#displayImage1').append( "<img src='" + wedding + val +"'>" );
                 listname.push(val);
            } 
        });
}

function myfunction() {

alert (listname);

}

</pre>

Answer 7

您不需要聲明變量。 Ajax成功函數自動最多需要3個參數： Function( Object data, String textStatus, jqXHR jqXHR )

Answer 8

在您的組件中，即角度JS代碼：

function getData(){
    window.location.href = 'http://localhost:1036/api/Employee/GetExcelData';
}