帶功能的jQuery異步請求

Question

function form(elem) { 
    var dati = $(elem).serialize(); 
    var action = $(elem).attr("action"); 
    var result = ""; 
    $.post(action, dati, function (data) { 
     result = jQuery.parseJSON(data); 
     alert(result) 
     return result; 
    }); 
} 
$(document).on("submit", "#new-search-field", function() { 
    var data = form($(this)); 
    alert(data); 
    if (......) {..... 
    } 
}); 

我需要讀取來自post請求的異步結果，但我不能，因爲我在「return result;」之前得到alert（data）

我該如何解決它？

Answer 1

您需要爲您的帖子包含一個回調，因爲他們現在的代碼是它的方式，它會調用帖子，但只是繼續執行下一個命令。我只是給你的函數添加一個額外的參數。事情是這樣的：

function form(elem, callback) { 
    var dati = $(elem).serialize(); 
    var action = $(elem).attr("action"); 
    var result = ""; 
    $.post(action, dati, function (data) { 
     result = jQuery.parseJSON(data); 
     callback(result); 
    }); 
} 
$(document).on("submit", "#new-search-field", function() { 
    form($(this), function (data) { alert(data); }); 
    if (......) {..... 
    } 
}); 

希望這有助於

Answer 2

這是因爲你的職位是實現異步的。嘗試使用回調函數來訪問您的發佈請求的結果

Answer 3

這不是異步工作方式。

您在return result;之前得到alert(data)，因爲$.post以異步方式工作。 form函數執行並返回，然後一段時間後$.post將有Ajax響應數據可用，並將調用所提供的回調函數作爲參數傳遞數據。

要完成你想要你基本上有兩種選擇什麼：

• 您可以使用一個回調（一旦異步操作完成時調用）。
• 使用承諾/延期。

回調版本1：

function form(elem, callback) { 
    ... 
    $.post(..., function(data) { 
     data = f(data); // transform data somehow if you have to 
     callback(data); 
    }); 
} 
$(document).on(..., function() { 
    form($(this), function(data) { 
     // use data 
    }); 
}); 

回調版本2：

function form(elem, callback) { 
    ... 
    $.post(..., callback); 
} 
$(document).on(..., function() { 
    form($(this), function(data) { 
     // use data 
    }); 
}); 

承諾版本：

function form(elem) { 
    ... 
    return $.post(...); 
} 
$(document).on(..., function() { 
    form($(this)) 
     .done(function(data) { 
      // use data 
     }) 
     .fail(function() { 
      // error 
     }); 
});