Jquery ajax 在每个循环中调用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3237553/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery ajax call within an each loop
提问by DazzledKid
I'm having a problem when using the jquery .each() and .ajax() functions together. I'm using .each() to loop through 5 elements and am performing the .ajax() call for each one. My problem is that I only want the loop to continue when a response has been received from each ajax request. Currently, all 5 elements are being looped, 5 ajax requests being made, then 5 responses being returned.
我在同时使用 jquery .each() 和 .ajax() 函数时遇到问题。我正在使用 .each() 循环遍历 5 个元素,并对每个元素执行 .ajax() 调用。我的问题是,当从每个 ajax 请求收到响应时,我只希望循环继续。目前,所有 5 个元素都被循环,发出 5 个 ajax 请求,然后返回 5 个响应。
Hers's a simple example:
她是一个简单的例子:
$(".element").each(function() {
var id= $(this).find(('txtId').val();
$.ajax({
type: "POST",
url: "/Handlers/Handler.ashx",
data: "ID=" + id,
success: function(xml){
// I would like the each() loop to pause until this is hit,
// and some additional logic can be performed.
}
});
});
Cheers.
干杯。
采纳答案by Pekka
You could use the async
option for this to make each request synchronous (= halt script execution until each request is finished):
您可以使用此async
选项使每个请求同步(= 停止脚本执行,直到每个请求完成):
asyncBy default, all requests are sent asynchronous (i.e. this is set to true by default). If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.
async默认情况下,所有请求都是异步发送的(即默认设置为 true)。如果您需要同步请求,请将此选项设置为 false。跨域请求和 dataType: "jsonp" 请求不支持同步操作。请注意,同步请求可能会暂时锁定浏览器,从而在请求处于活动状态时禁用任何操作。
but, as the docs already say, this is highly discouraged, as it could freeze the browser if a request hangs or times out.
但是,正如文档已经说过的,这是非常不鼓励的,因为如果请求挂起或超时,它可能会冻结浏览器。
It would be better to change the architecture of your code in a way that can work with the classical callback functions if at all possible.
如果可能的话,最好以一种可以与经典回调函数一起使用的方式更改代码的体系结构。
回答by YonahW
Pekka has the correct answer. You just need to edit your script as below.
佩卡有正确的答案。您只需要如下编辑您的脚本。
$(".element").each(function() {
var id= $(this).find(('txtId').val();
$.ajax({
type: "POST",
async: false,
url: "/Handlers/Handler.ashx",
data: "ID=" + id,
success: function(xml){
}
});
});
回答by Radu
i'm happy to say there's a way... but it's a bit nasty.
我很高兴地说有一种方法......但它有点讨厌。
If you are sure the request has to give something back, then you can remove the "tryIteration" part.
如果您确定请求必须返回某些内容,那么您可以删除“tryIteration”部分。
$(document).ready(function() {
loop(".buttonsPromotion", 0);
});
function loop(elements, tryIteration) {
//HOW MANY TRIES UNTIL WE STOP CHECKING
if(tryIteration<7){
$(elements).each(function() {
var actuel = $(this);
$.ajax({
url: "write your link here",
data: {},
dataType: 'json',
async: true,
success: function(data){
//HERE WE KNOW THE AJAX REQUEST WENT OK
actuel.addClass('AjaxOK');
},
error:function(thrownError){
console.log(thrownError);
//WE MAKE ANOTHER EACH ON ALL ELEMENT THAT WENT BAD
var elemToRetry = actuel.not('AjaxOK');
loop(elemToRetry, ++tryIteration);
}
});
});
}
}
回答by Arooran
You can use the jquery deffered and promise function to check the async call is success or not. http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/
您可以使用 jquery defered 和 promise 函数来检查异步调用是否成功。http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/