2011-02-14 176 views
5

我正在寫一個通用函數,將在我的腳本中的多個地方重用。Javascript回調函數與AJAX

該函數使用ajax(使用jQuery庫),所以我想以某種方式將一個函數(或多行代碼)傳入此函數中,以便在ajax完成時執行。 我認爲這需要一個回調函數,但通過幾個回調答案閱讀後,我仍然有點困惑,我將如何實施在我的情況。

我目前的功能是:

function getNewENumber(parentENumber){ 

     $.ajax({ 
       type: "POST", 
       url: "get_new_e_number.php", 
       data: {project_number: projectNumber, parent_number: parentENumber}, 
       success: function(returnValue){ 
        console.log(returnValue); 
        return returnValue; //with return value excecute code 

       }, 
       error: function(request,error) { 
        alert('An error occurred attempting to get new e-number'); 
        // console.log(request, error); 
       } 
     }); 
    } 

有了這個功能,我希望能夠做一些同樣的方式與其他jQuery函數即工作;

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(){ 
    alert(//the number that is returned by getNewENumber); 
}); 
+0

我想,這是不可能的這樣:

function getNewENumber(parentENumber) { return $.ajax({ ... }); } getNewENumber(E1 - 3).then(success_callback, error_callback); 

如果你想保留錯誤回調該功能您可以有替代。你應該交換功能。 – kirilloid 2011-02-14 02:16:48

回答

7

只要給getNewENumber該函數另一個參數,然後使用它作爲回調。

// receive a function -----------------v 
function getNewENumber(parentENumber, cb_func){ 

    $.ajax({ 
      type: "POST", 
      url: "get_new_e_number.php", 
      data: {project_number: projectNumber, parent_number: parentENumber}, 

      // ------v-------use it as the callback function 
      success: cb_func, 
      error: function(request,error) { 
       alert('An error occurred attempting to get new e-number'); 
       // console.log(request, error); 
      } 
    }); 
} 

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(returnValue){ 
    alert(returnValue); 
}); 
+0

完美。我覺得這很簡單。當它放在你自己的環境中時,學習總是更容易。謝謝 – 2011-02-14 02:28:51

+0

@Zak:不客氣。 – user113716 2011-02-14 02:30:03

2

@patrick dw's anwser是正確的。但是,如果你想保持調用console.log(或任何其他操作)總是,無論主叫用戶代碼的功能是什麼,那麼你可以添加回調(新參數)成功函數中你已經有:

function getNewENumber(parentENumber, cb_func /* <--new param is here*/){ 

    $.ajax({ 
      type: "POST", 
      url: "get_new_e_number.php", 
      data: {project_number: projectNumber, parent_number: parentENumber}, 
      success: function(returnValue){ 
       console.log(returnValue); 
       cb_func(returnValue); // cb_func is called when returnValue is ready. 
      }, 
      error: function(request,error) { 
       alert('An error occurred attempting to get new e-number'); 
       // console.log(request, error); 
      } 
    }); 
} 

而且調用代碼保持一樣的你除了功能將通過參數收到的returnValue:

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(val /* <--new param is here*/){ 
    alert(val); 
}); 
0

這與jQuery的Deferred Objects可以做得更好。讓您的AJAX呼叫返回jqXHR對象。 (至少還是很辛苦)

function getNewENumber(parentENumber) { 
    var jqXHR = $.ajax({ ... }); 
    jqXHR.fail(...); 
    return jqXHR; 
} 

getNewENumber(E1 - 3).done(success_callback);