JavaScript: setTimeout不会暂停循环
JavaScript: setTimeout不会暂停循环
提问于 2016-08-02 00:10:57
我需要在我的循环中做一些延迟，每次在一定数量的数据(在我的循环中经过几次循环/迭代之后)被发送到服务器之后。
从服务器发送数据和接收响应工作得很好，但循环中请求的延迟仍然不起作用。
非常感谢你的帮助。
编辑:代码已更改，请检查第三个答案(我的)。
<!DOCTYPE html>
<html>
<body>
<h2>AJAX</h2>
<button type="button" onclick="loadDoc()">Request data</button>
<p id="demo"></p>
<script>
function loadDoc() {
var xhttp = [];
var code = [
"WOICEL0Q9P",
"ZJTS4GYJEJ",
"HJPMQOCX31",
"MP26N0BH01",
"7TJNYZIRJR",
"Z5MIDDG4N2",
"BX6MKYK0O7",
"KVFVH1ESQX",
"40ADY3ZBE5",
"V4NT360JR5",
"FDI8AFL680",
"ZH89N59XQR",
"M6OS2OX38H",
"D8O76YDLM0",
"86GBMJLIXY",
"1QRFVU26VK",
"HFUI9QV6DY",
"VN83OGR825",
"DDMPCBX2MF",
"2M3QFPI234"
];
var i = code.length;
var j = code.length;
var k = 5000;
var p = 0;
while (i--) {
var process = (function(i) {
if (p == 5) {
p = 0;
function func(i) {
xhttp[i] = new XMLHttpRequest();
xhttp[i].onreadystatechange = function() {
if (xhttp[i].readyState == 4 && xhttp[i].status == 200) {
if (i == j) {
document.getElementById("demo").innerHTML = code[i] + ": " + xhttp[i].responseText;
}
else {
document.getElementById("demo").innerHTML += "<br><br>" + code[i] + ": " + xhttp[i].responseText;
}
}
};
xhttp[i].open("POST", "https://www.example.com/services/postdata.svc", true);
xhttp[i].setRequestHeader("Host", "www.example.com");
xhttp[i].setRequestHeader("Accept", "application/json, text/javascript");
xhttp[i].setRequestHeader("Accept-Language", "cs,en-US;q=0.7,en;q=0.3");
xhttp[i].setRequestHeader("Accept-Encoding", "gzip, deflate, br");
xhttp[i].setRequestHeader("Content-Type", "application/json; charset=utf-8");
xhttp[i].setRequestHeader("Cache-Control", "no-cache");
xhttp[i].setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhttp[i].setRequestHeader("Referer", "https://www.example.com/postdata-test.htm");
xhttp[i].setRequestHeader("Content-Length", "37");
xhttp[i].setRequestHeader("Connection", "keep-alive");
xhttp[i].send('{"code":"'+code[i]+'","confirm":false}');
//console.log('hello - Test if delay is here');
p++;
}
setTimeout(func(i), k);
k += 5000;
}
else {
xhttp[i] = new XMLHttpRequest();
xhttp[i].onreadystatechange = function() {
if (xhttp[i].readyState == 4 && xhttp[i].status == 200) {
if (i == j) {
document.getElementById("demo").innerHTML = code[i] + ": " + xhttp[i].responseText;
}
else {
document.getElementById("demo").innerHTML += "<br><br>" + code[i] + ": " + xhttp[i].responseText;
}
}
};
xhttp[i].open("POST", "https://www.example.com/services/postdata.svc", true);
xhttp[i].setRequestHeader("Host", "www.example.com");
xhttp[i].setRequestHeader("Accept", "application/json, text/javascript");
xhttp[i].setRequestHeader("Accept-Language", "cs,en-US;q=0.7,en;q=0.3");
xhttp[i].setRequestHeader("Accept-Encoding", "gzip, deflate, br");
xhttp[i].setRequestHeader("Content-Type", "application/json; charset=utf-8");
xhttp[i].setRequestHeader("Cache-Control", "no-cache");
xhttp[i].setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhttp[i].setRequestHeader("Referer", "https://www.example.com/postdata-test.htm");
xhttp[i].setRequestHeader("Content-Length", "37");
xhttp[i].setRequestHeader("Connection", "keep-alive");
xhttp[i].send('{"code":"'+code[i]+'","confirm":false}');
p++;
}
})(i);
}
}
</script>
</body>
</html>回答 2
Stack Overflow用户
发布于 2016-08-02 00:15:50
您不断地在while中立即产生对process()的多个调用，然后告诉process在回调发生之前等待5秒。
// Run this loop over and over again
while (true) {
// Create a function called process that process data
var process = (function () {
// Do something with data
console.log("Something");
// Wait a few seconds and do it again
setTimeout(process, 5000);
// This () right here says call process right now
}());
}Stack Overflow用户
发布于 2016-08-02 00:27:20
var p = 0;
var k = 0;
var now = new Date();
var code = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20];
for (var index = 0; index < code.length; index++) {
(function(idx, timeout){
setTimeout(function(i) {
//write your code herei
console.log("printed after", (new Date() - now)/1000, " Seconds");
}, timeout, idx);
p++;
if(p==5){
p = 0;
k += 5000;
}
})(index, k);
}以下是输出
printed after 0.006 Seconds
printed after 0.008 Seconds
printed after 0.008 Seconds
printed after 0.008 Seconds
printed after 0.008 Seconds
printed after 5.008 Seconds
printed after 5.008 Seconds
printed after 5.008 Seconds
printed after 5.008 Seconds
printed after 5.008 Seconds
printed after 10.007 Seconds
printed after 10.007 Seconds
printed after 10.007 Seconds
printed after 10.007 Seconds
printed after 10.007 Seconds
printed after 15.008 Seconds
printed after 15.008 Seconds
printed after 15.008 Seconds
printed after 15.008 Seconds
printed after 15.008 Seconds页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/38703456
复制相关文章
相似问题
腾讯云开发者
