如何解决在for循环之前,事情发生在我的for循环之外javascript
|| 我确定我之前已经看过此书,并且知道答案,但是12个小时后...我的想法完全糊涂了。 我有一个for循环,在该循环中,我尝试连接到字符串上,以便在我可以完成希望插入到html中并显示给用户的字符串(从而完成一个漂亮的小桌子)之后。 但是,函数的末尾(在for循环之后)在for循环执行之前就已被调用。function getEntries() {
$(\'#entryTotalsDiv\').html(\'<img src=\"images/ajax-loader.gif\" /> ... retrieving form totals.\');
var entryTotalsTable = \"<table id=\'entryTable\' class=\'display\' style=\'border:1px;\'><thead><tr><th>Form Name</th><th>Hash</th><th>Entries</th></tr></thead>\" +
\"<tbody>\"
//Get rows ONE at a time.
var countNumber = 1;
for (var frm = 0; frm < numberOfForms; frm++) {
$.post(\'ajax/getEntries.aspx\',{
\'formNumber\': frm
},function (data) {
entryTotalsTable += \"<tr><td>\" + data[0].formName + \"</td><td>\" + data[0].formHash + \"</td><td>\" + data[0].formEntryCount + \"</td></tr>\";
//Now go and update the Form Retrieval div -- add 1 to the frm Number
$(\'#formNamesDiv\').html(countNumber + \' of \' + numberOfForms + \' retrieved.\');
countNumber++;
});
}
entryTotalsTable += \"</tbody></table>\";
$(\'#entriesDiv\').html(entryTotalsTable);
//Now bind the table to the DataTables JQ script
$(\'#entryTable\').dataTable();
$(\'#entryTable\').show(\'slow\');
}
如果您注意到了,我想在最后关闭Table html,但是在我的for循环完成之前调用了它,从而弄乱了我的字符串...
?
entryTotalsTable += \"</tbody></table>\";
$(\'#entriesDiv\').html(entryTotalsTable);
//Now bind the table to the DataTables JQ script
$(\'#entryTable\').dataTable();
$(\'#entryTable\').show(\'slow\');
}
解决方法
$ .post是异步的,这意味着它会尽可能快地触发循环中的所有请求,然后退出循环。它不等待响应。当响应返回时,您的行函数将被调用...但是到那时,所有帖子均已发送。
在这里查看此问题的答案...
如何让jQuery执行同步而不是异步的Ajax请求?
您需要将$ .post更改为$ .ajax
, 一种解决方案是将每个响应保存在数组中,并在每个回调中测试当前计数是否等于总计数。就像是:
var countNumber = 1,allData = [];
function runWhenFinished() {
if(countNumber === numberOfForms) {
var entryTotalsTable = \"<table id=\'entryTable\' class=\'display\' style=\'border:1px;\'><thead><tr><th>Form Name</th><th>Hash</th><th>Entries</th></tr></thead>\" + \"<tbody>\";
for(var i = 0,l = allData.length; i < l; i++) {
entryTotalsTable += \"<tr><td>\" + allData[i].formName + \"</td><td>\" + allData[i].formHash + \"</td><td>\" + allData[i].formEntryCount + \"</td></tr>\";
}
entryTotalsTable += \"</tbody></table>\";
$(\'#entriesDiv\').html(entryTotalsTable);
//Now bind the table to the DataTables JQ script
$(\'#entryTable\').dataTable();
$(\'#entryTable\').show(\'slow\');
}
}
for(var frm = 0; frm < numberOfForms; frm++) {
(function(frm) {
$.post(\'ajax/getEntries.aspx\',{\'formNumber\': frm},function (data) {
allData[frm] = data[0];
countNumber++;
$(\'#formNamesDiv\').html(countNumber + \' of \' + numberOfForms + \' retrieved.\');
runWhenFinished();
});
}(frm));
}
我敢肯定,这仍然可以改善,但是您明白了。
如果您确实提出了70个请求,那么您可能还是要重新考虑您的策略。 70个并发请求很多。
例如。您可以提出一个请求,并证明应检索/更新的最小数量和最大数量/无论该方法在做什么。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。