JQuery AJAX函數的工作原理，但無法正確返回變量

Question

我有一個函數runAjax，它可以正常工作。不幸的是我掙扎着返回從ajax查詢中獲得的值。

ajax函數將「contents」或「error」xml標記內的返回值賦給變量「result」。

如果我警告ajax函數內的結果變量，它會提示正確的值（即如果內容中的xml值是「已發佈」，它會發布警報）。

但是，如果我警告從runAjax函數返回的值，它會警告一個對象，而不是上面示例中「發佈」的內部變量「result」的值。

function runAjax (data_obj){ 
    return $.ajax({ 
     url:"/ajax.php", 
     dataType: "xml", 
     data: data_obj, 
     success: function(data) { 
     // format result 
     var xml; 
     if (typeof data == "string") { 
      xml = new ActiveXObject("Microsoft.XMLDOM"); 
      xml.async = false; 
      xml.loadXML(data); 
     } else { 
      xml = data; 
     } 
     var result; 
     if($("error",xml).text()){ 
      result = [$("error",xml).text()]; 
     } else{ 
      result = [ 
      $("contents", xml).text() 
      ]; 
     } 
     alert(result); //alerts the correct string for example "published" 
     return result; 
     } 
    }); 
    } 
    $('ul.content li span.changeable').click(function(e){ 
    e.preventDefault(); 
    var method_set = $(this).parent().attr("class"); 
    var id_set = $(this).parent().parent().find('li.id span').html(); 
    var user = $(this); 
    var result = runAjax({method: method_set, id: id_set}); 
    alert(result); //alerts an object not published 

    }); 

我確定它與我返回變量的方式有關，但我無法弄清楚。任何輸入將不勝感激。

問候 盧克

UPDATE： 這是從人以下的作品感謝所有輸入修改後的代碼：

function runAjax (data_obj,callback){ 
    $.ajax({ 
     url:"/ajax.php", 
     dataType: "xml", 
     data: data_obj, 
     success: function(data) { 
     // format result 
     var xml; 
     if (typeof data == "string") { 
      xml = new ActiveXObject("Microsoft.XMLDOM"); 
      xml.async = false; 
      xml.loadXML(data); 
     } else { 
      xml = data; 
     } 
     var result; 
     if($("error",xml).text()){ 
      result = [$("error",xml).text()]; 
     } else{ 
      result = [ 
      $("contents", xml).text() 
      ]; 
     } 
     if (typeof(callback) == "function") { 
      callback(result); 
     } 
     } 
    }); 
    } 
    $('ul.content li span.changeable').click(function(e){ 
    e.preventDefault(); 
    var method_set = $(this).parent().attr("class"); 
    var id_set = $(this).parent().parent().find('li.id span').html(); 
    var user = $(this); 
    runAjax({ 
     method: method_set, 
     id: id_set 
    }, 
    function(result){ 
     $(user).html(result.join('')); //this is instead of alert(result); 
    } 
    ); 

    }); 

Answer 1

按照docs

的$阿賈克斯（）函數返回它創建的XMLHttpRequest對象。

從成功回調函數返回的任何返回值都被忽略。

您需要將該值放在比回調函數（全局函數，或最好在一個外部函數內）更廣泛的範圍內定義的變量中。

var result; 
    $.ajax({ 
     .... 
     success : function(data) { 
      ... 
      result = ...; 
     } 
    }); 

或者更好的是：做任何你想要的成功回調函數中的返回值做的，這將讓Ajax調用的異步性，並意味着你不需要等待調用回來。

在成功回調函數中進行處理意味着你知道你已經得到了結果，如果你將該值放入一個變量中，那麼當你想要使用該變量時，變量可能不會被分配一個值。

在此頁面上的另一個答案評論你說：

不過我打電話從其他多種功能不只是一個在我上面的代碼示例runAjax功能，所以我需要返回的值，而比runAjax功能做HTML更換

我會添加一個額外的參數，你runAjax功能，這是另一個回調函數，你可以在不同的處理功能通過從各種功能。

function runAjax(data_obj, callback) { 
    $.ajax({ 
     ... 
     success : function(data) { 
      ... 
      result = ... 
      ... 
      if (typeof(callback) == "function") { 
       callback(result); 
      } 
     } 
    }); 
} 

然後，你可以這樣調用它

runAjax({method: method_set, id: id_set}, 
    function(result){ 
     alert(result); 
    } 
); 

然後，你可以做你的成功的功能數據的通用處理，但在回調函數每次調用自定義處理。

如果你真的需要等待調用，你可以通過異步選項來創建一個同步Ajax調用：

$.ajax({ 
    async:false, 
    .... 

Answer 2

嘗試刪除[和]

if($("error",xml).text()){ 
     result = $("error",xml).text(); 
    } else{ 
     result = $("contents", xml).text(); 
    } 

Answer 3

盧克，

我認爲你在函數中的錯誤點分配了重試值，你應該在最後的大括號之前有一個單獨的出口點。您在技術上返回結果作爲$ .ajax（）函數（一個XMHTTP對象）的返回值，而不是父方法。

試試這個：

function runAjax (data_obj){ 
    var returnValue; 
    $.ajax({ 
     url:"/ajax.php", 
     dataType: "xml", 
     data: data_obj, 
     success: function(data) { 
      // format result 
      var xml; 
      if (typeof data == "string") { 
       xml = new ActiveXObject("Microsoft.XMLDOM"); 
       xml.async = false; 
       xml.loadXML(data); 
      } else { 
       xml = data; 
      } 
      var result; 
      if($("error",xml).text()){ 
       result = [$("error",xml).text()]; 
      } else{ 
       result = [ 
       $("contents", xml).text() 
       ]; 
      } 
      alert(result); //alerts the correct string for example "published" 
      returnValue = result; 
     } 
    }); 
    return returnValue; 
} 
$('ul.content li span.changeable').click(function(e){ 
    e.preventDefault(); 
    var method_set = $(this).parent().attr("class"); 
    var id_set = $(this).parent().parent().find('li.id span').html(); 
    var user = $(this); 
    var result = runAjax({method: method_set, id: id_set}); 
    alert(result); //alerts an object not published 

}); 

Answer 4

，你不能得到結果的原因返回正確是因爲AJAX的異步性（這是第一個「A」表示）。

在AJAX操作完成並調用'success'處理程序之前，對runAjax（）的調用可能會返回很久。 runAjax（）調用將引用返回給用於調用AJAX通信的XMLHttpRequest對象。成功處理程序的返回值不能直接用於您，因爲它返回到$ .ajax（）代碼的內部工作。

一個合適的解決方案將取決於你想要做什麼'結果' - 我猜'alert（result）'僅用於說明目的。

Answer 5

盧克，

基本上，爲您的$的包裝功能。阿賈克斯（）的回調部分對應的參數調用（你當然可以有在Ajax調用任何有效的放慢參數參數這裏的匆匆證明：

function runAjax (data_obj, callback){ 
    $.ajax({ 
     url:"/ajax.php", 
     dataType: "xml", 
     data: data_obj, 
     success: function(data) { 
      if (data != null && callback !== null) { 
       callback(data); 
      } 
     } 
    }); 
} 

function callbackFunction (data) { 
    // format result 
    var xml; 
    if (typeof data == "string") { 
     xml = new ActiveXObject("Microsoft.XMLDOM"); 
     xml.async = false; 
     xml.loadXML(data); 
    } else { 
     xml = data; 
    } 
    var result; 
    if($("error",xml).text()){ 
     result = [$("error",xml).text()]; 
    } else{ 
     result = [ 
     $("contents", xml).text() 
     ]; 
    } 
    alert(result); //alerts the correct string for example "published" 
    // do your DOM updates etc here 
} 

$('ul.content li span.changeable').click(function(e){ 
    e.preventDefault(); 
    var method_set = $(this).parent().attr("class"); 
    var id_set = $(this).parent().parent().find('li.id span').html(); 
    var user = $(this); 
    runAjax({method: method_set, id: id_set}, callbackFunction); 
}); 

希望這有助於..

Answer 6

盧克， 爲了進一步完善了我和Jim提供的答案，考慮到結果解析位很可能是針對每個不同的呼叫一致...

function runAjax (data_obj, callback){ 
    $.ajax({ 
     url:"/ajax.php", 
     dataType: "xml", 
     data: data_obj, 
     success: function(data) { 
      if (data != null && callback !== null) { 
       // format result 
       var xml; 
       if (typeof data == "string") { 
        xml = new ActiveXObject("Microsoft.XMLDOM"); 
        xml.async = false; 
        xml.loadXML(data); 
       } else { 
        xml = data; 
       } 
       var result; 
       if($("error",xml).text()){ 
        result = [$("error",xml).text()]; 
       } else{ 
        result = [$("contents", xml).text()]; 
       } 
       callback(result); 
      } 
     } 
    }); 
} 

function callbackFunction (result) { 
    alert(result); //alerts the correct string for example "published" 
    // do your DOM updates etc here 
} 

$('ul.content li span.changeable').click(function(e){ 
    e.preventDefault(); 
    var method_set = $(this).parent().attr("class"); 
    var id_set = $(this).parent().parent().find('li.id span').html(); 
    var user = $(this); 
    runAjax({method: method_set, id: id_set}, callbackFunction); 
}); 

Answer 7

您可以將ajax調用的成功處理爲一個事件，該事件可以保持異步調用的好東西，包括基於您調用的url的東西。

$('ul.content li span.changeable').ajaxSuccess(function(e, xhr, settings) { 
    if (settings.url == '/ajax.php') { 
    $(this).text('Triggered ajaxSuccess handler.'); 
    someglobalresultvariable = xhr.responseXML; // the xml of the response 
    $(this).text(someglobalresultvariable); 
    } 
}); 

在這裏，我假設您想要根據點擊的項目更改跨度內容文本。

注意：我替換了「已觸發的」文本消息，僅以示例的形式顯示。你可以決定你想如何處理結果。