Question

我正在使用以下代码向用户显示一些文本。

基本上我需要展示的是：

1 2 3 4

但是此代码显示，

1 4

这是代码：

    <script>
    function myFunction() {
    setTimeout(function() {
      document.getElementById('p').innerHTML = "1";
    }, 2000);

    setTimeout(function() {
      document.getElementById('p').innerHTML = "2";
    }, 4000);

    setTimeout(function() {
      document.getElementById('p').innerHTML = "3";
    }, 4000);

    setTimeout(function() {
      document.getElementById('p').innerHTML = "4";
    }, 4000);
    };
    </script>


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

<input onclick="myFunction()" type="submit" />

有谁知道为什么会这样？

提前致谢。

Answer 1

因为

setTimeout(function() {
  document.getElementById('p').innerHTML = "2";
}, 4000);

setTimeout(function() {
  document.getElementById('p').innerHTML = "3";
}, 4000);

setTimeout(function() {
  document.getElementById('p').innerHTML = "4";
}, 4000);
};

正在编辑相同的元素所以你只看到最后一次操作的结果：4

setTimeout()方法在指定的毫秒数后调用函数或计算表达式。 在你的情况下，时间是相同的，所以所有都在同一时间执行。

在它们之间设置一些间隔。

Answer 2

setTimeout无法计算从上一个setTimeout完成的时间，但是从执行setTimeout语句开始计算时间。

因此，setTimeout，2和3的所有4语句几乎同时开始等待4秒。

Answer 3

您正在快速连续编辑相同的元素，如果您为setTimeout设置不同的值，例如1000,2000,3000,4000，您会看到文本从1更改为2到3到4，间隔为1秒（（每次更改之间）。

settimeout javascript没有正常运行？

3 个答案: