[英]How to make pause between each for loop iteration in JavaScript
I'm sorry if there has already been such question, I haven't found.对不起,如果已经有这样的问题,我还没有找到。
I wanna make a progress (loading) animation with JS:我想用JS取得进展(加载)animation:
<div class = "load">
<div id = "load_fill"></div>
<p id = "percent">0%</p>
</div>
<script>
let percent = document.getElementById("percent");
let load_fill = document.getElementById("load_fill")
let j = 0;
let fill = () => {
j++;
percent.textContent = `${j}%`;
load_fill.style.width = `${j}%`
}
for (let i = 0; i < 100; i++){
setTimeout(fill, 200);
}
</script>
The problem is that the first iteration works with delay but others no;问题是第一次迭代有延迟,但其他没有;
Is there any way to make delay between each iteration?有没有办法在每次迭代之间进行延迟?
Will be thankful for any answer.将感谢任何答案。
new Array(100).map((el, ind) => ind).forEach((cur) => setTimeout(fill, (cur + 1) * 200))
Here, we space out each setTimeout by first creating a range array (the first part) before setting a time out 200 ms between each one.在这里,我们首先创建一个范围数组(第一部分),然后将每个 setTimeout 间隔设置为 200 毫秒。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.