Javascript 暂停整个脚本一段时间的等待函数

Question

我想做一个网站。大致原则：用户可以使用 prompt() 函数输入时间和回合。打印文本的循环如此频繁地运行用户输入它的方式以及在每次打印之间我希望循环暂停一段时间，用户之前输入。

我看了很多帖子，但没有一个有用的。

在脚本中，我使用了一个睡眠函数，它会等待很长时间直到输入时间等于当前时间，这与 setTimeout() 函数几乎一样，但两者都不适合我，因为它不会暂停整个脚本完全。该脚本休眠用户输入的时间乘以轮数，然后同时打印所有文本。

我想要一个可以真正暂停循环并在输入的时间后继续循环的函数。

抱歉英语不好，需要帮助

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre><code>var textPara = document.getElementById("para");
var rounds = prompt("How often");

var count = 1;

do {
    textPara.textContent += "Round " + count;
    count++;
    sleep(5000);

} while (count <= rounds)


function sleep(miliseconds) {
    var currentTime = new Date().getTime();

    while (currentTime + miliseconds >= new Date().getTime()) {
    }
}

<p id="para"></p>

Answer 1

这是您想要的吗？

var textPara = document.getElementById("para");
var rounds = 5; // prompt("How often");
var count = 1;
var interval = 500; 

function update(){
  textPara.textContent += "Round " + count;
  count++;
  if (count <= rounds){setTimeout(update,interval)}
}
update();

<div id="para"></div>

在您的原始代码中，事件循环在 while 循环中被阻塞并立即移动到随后的代码，这会触发另一个睡眠...因此浏览器屏幕仅在所有睡眠结束后更新（ textContent 值在 JS 中多次更新，但浏览器不显示。

在此示例中，更新函数在未来对自身进行新的（递归）调用，但事件循环和浏览器可以在此期间自由进行更新，因此我们看到了更新。

即使间隔为零以允许屏幕更新等，setTimeout 也可以通过这种方式使用。

Javascript 暂停整个脚本一段时间的等待函数

Javascript wait function that pauses the whole script for a certain time

javascript

wait