我希望 FOR 循环中的函数在继续执行下一个代码之前完成运行,但我就是无法让它工作。
在弹出警报窗口“幸运的是”之前,它应该淡入淡出文本“结果”,但我会在看到文本之前先看到警报窗口循环。我不知道我做错了什么。
HTML:
<div id="quotes" style="display: none;">Result</div>
Javascript:
function showNextQuote() {
$("#quotes").fadeIn(2000).delay(2000).fadeOut(2000);
}
for (i = 1; i < 4; i++){
showNextQuote(); alert("Lucky you");
};
最佳答案
由于这些操作是异步的,因此您无法在它们运行时阻止处理。相反,您向它们传递一个函数,以便在它们完成时执行(称为回调)。因此,像这样链接它们看起来更像是递归函数而不是循环。
(虽然从技术上来说这并不是真正的递归,因为异步操作没有构建堆栈。但它在语义/逻辑上与尾递归非常相似,至少在函数结构中是这样。)
类似这样的事情:
function showNextQuote(iteration) {
// terminating condition
if (iteration > 4) {
return;
}
// recurse
$("#quotes").fadeIn(2000).delay(2000).fadeOut(2000, function () {
alert("Lucky you");
showNextQuote(iteration + 1);
});
}
showNextQuote(1);
它的作用是定义函数,该函数在内部传递对其自身的引用作为对 fadeOut
的回调。每个回调都会将 iteration
值递增 1。然后在定义函数后,使用初始迭代值 1
调用它。
关于javascript - 在循环之前完成函数的运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26208735/