jQuery的阿贾克斯/。每次回调，下一个“每个'阿贾克斯前完成射击 [英] jQuery Ajax / .each callback, next 'each' firing before ajax completed
问题描述
嗨下面的Javascript调用，当我提交表单。它首先分割一堆网址的从文本区，它则：
1）将线到表中的每个网址，并在最后一栏（状态栏），它说：未启动。
2）这又遍历每个URL，首先它使一个Ajax调用检查状态（status.php），这将返回一个比例从0 - 100
3）在同一回路它揭开序幕通过ajax的实际过程（process.php），当这个过程完成（轴承在脑海中不断更新状态），它就会说，在状态栏已完成并退出自动刷新。
4）它应该然后进入下一个每个'，做同样的下一个URL。
函数formSubmit（）{
VAR线= $（'＃网址）VAL（）分裂（'\ N'）。
$每个（线，功能（键，值）{
$（'＃dlTable TR：最后一个）后（'＆LT; TR＆GT;＆LT; TD＆GT;+价值+'＆LT; / TD＆GT;＆LT; TD＆GT;未启动＆LT; / TD＆GT;＆LT; / TR＆GT;'）;
}）;
$每个（线，功能（键，值）{
无功自动刷新=的setInterval（函数（）{
$阿贾克斯（{
网址：status.php，
成功：功能（数据）{
。$（'＃dlTable）找到（TR），EQ（键+ 1）。儿童（）最后一个（）replaceWith。（＆LT; TD＆gt;中+数据+＆LT; / TD＆gt;中）;
}
}）;
}，1000）;
$阿贾克斯（{
网址：'process.php ID ='+值，
成功：函数（MSG）{
clearInterval（自动刷新）;
。$（'＃dlTable）找到（TR），EQ（键+ 1）。儿童（）最后一个（）replaceWith。（＆LT; TD＆GT;完成RIP＆LT; / TD＆gt;中）;
}
}）;
}）;
}
你想要的是运行多个异步操作的依次的，对不对？我想打造的功能的阵列来执行，并通过一系列的辅助运行它。
<一个href="https://github.com/michiel/asynchelper-js/blob/master/lib/sequencer.js">https://github.com/michiel/asynchelper-js/blob/master/lib/sequencer.js
变种行动= [];
$每个（线，功能（键，值）{
actions.push（函数（回调）{
$阿贾克斯（{
网址：'？process.php ID ='+ VAL，
成功：函数（MSG）{
clearInterval（自动刷新）;
//
//在这里对您的DOM操作，并确保调用
// 回电话！
//
回电话（）;
}
}）;
}）;
}
）;
正如你所看到的，我们构建的范围函数，把任意回调作为参数数组。定序将按顺序运行它们。
从GitHub的链接使用序列助手和运行，
无功序=新序（的行动）;
sequencer.start（）;
有，顺便说一句，可能在code的几行定义音序器的功能。例如，
函数序（ARR）{
（功能（） {
（！（arr.length = 0）及及（arr.shift（）（arguments.callee的）））;
}）（）;
}
Hi the below Javascript is called when I submit a form. It first splits a bunch of url's from a text area, it then:
1) Adds lines to a table for each url, and in the last column (the 'status' column) it says "Not Started".
2) Again it loops through each url, first off it makes an ajax call to check on the status (status.php) which will return a percentage from 0 - 100.
3) In the same loop it kicks off the actual process via ajax (process.php), when the process has completed (bearing in the mind the continuous status updates), it will then say "Completed" in the status column and exit the auto_refresh.
4) It should then go to the next 'each' and do the same for the next url.
function formSubmit(){
var lines = $('#urls').val().split('\n');
$.each(lines, function(key, value) {
$('#dlTable tr:last').after('<tr><td>'+value+'</td><td>Not Started</td></tr>');
});
$.each(lines, function(key, value) {
var auto_refresh = setInterval( function () {
$.ajax({
url: 'status.php',
success: function(data) {
$('#dlTable').find("tr").eq(key+1).children().last().replaceWith("<td>"+data+"</td>");
}
});
}, 1000);
$.ajax({
url: 'process.php?id='+value,
success: function(msg) {
clearInterval(auto_refresh);
$('#dlTable').find("tr").eq(key+1).children().last().replaceWith("<td>completed rip</td>");
}
});
});
}
What you want is to run several asynchronous actions in sequence, right? I'd build an array of the functions to execute and run it through a sequence helper.
https://github.com/michiel/asynchelper-js/blob/master/lib/sequencer.js
var actions = [];
$.each(lines, function(key, value) {
actions.push(function(callback) {
$.ajax({
url: 'process.php?id='+val,
success: function(msg) {
clearInterval(auto_refresh);
//
// Perform your DOM operations here and be sure to call the
// callback!
//
callback();
}
});
});
}
);
As you can see, we build an array of scoped functions that take an arbitrary callback as an argument. A sequencer will run them in order for you.
Use the sequence helper from the github link and run,
var sequencer = new Sequencer(actions);
sequencer.start();
It is, btw, possible to define sequencer functions in a few lines of code. For example,
function sequencer(arr) {
(function() {
((arr.length != 0) && (arr.shift()(arguments.callee)));
})();
}
这篇关于jQuery的阿贾克斯/。每次回调，下一个“每个'阿贾克斯前完成射击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
