Question

我希望在一秒钟之后逐个显示数字，但是低于编码会显示整数。

function showVal(){
    for(i=0; i<5; i++)
    {
        var showingVal= document.write("the number is "+i);
        document.write("<br />");       
    }
}
setInterval('showVal()',1000);

Answer 1

不要使用循环内部函数，而是使用全局变量并在函数内使用它并检查数字是否达到限制然后清除间隔

Answer 2

最好使用setTimeout代替。

function showVal(n) {
  if(!n)
    n = 0;
  var showingVal = document.write("the number is " + n);
  document.write("<br />");       

  if(n < 4) {
    setTimeout(function() { showVal(n + 1); }, 1000);
  }
}

setTimeout(showVal, 1000);

演示：http://jsbin.com/avunif

这比setInterval更好，因为在您打印5个数字后，您的刻度线处理程序将不会被调用。效率。加上没有全局变量。： - ）

或者你可以改为clearInterval。

Answer 3

您不能在间隔中使用document.write，因为它会在文档完成后写入文档，然后文档将替换为文本。

此外，函数中的代码一次不输出一个数字，它一次输出所有数字。你需要在函数外部使用一个计数器，以便它可以跟踪它的位置。

使用clearInterval在输出所有数字后停止间隔。

将文本放在页面中已存在的元素中。将代码放在页面中的元素下面，以便在代码启动时创建元素。

<div id="SomeElement"></div>

<script type="text/javascript">

var handle, counter = 0, text = '';

function showVal(){
  if (counter < 5) {
    text += "the number is " + counter + "<br />";       
    document.getElementById("SomeElement").innerHTML = text;
    counter++;
  } else {
    window.clearInterval(handle);
  }
}

handle = window.setInterval(showVal, 1000);

</script>

演示：http://jsfiddle.net/Guffa/CY5DV/

（这可以在闭包中完成，这样它就不会用变量污染全局范围，但这对于这个问题中的主要问题并不重要。）

Answer 4

function printCount() {
    for (let i = 1; i <= 5; i++) {
       setTimeout(function() {
            document.write(i + "<br>");
            }, i * 1000);
        }
   }
   printCount();

想要在第二个间隔之后逐个显示数字

4 个答案: