setTimeout 语法不正确

Question

我正在尝试制作一个虚假的加载屏幕，我需要在加载消息之间有大约 20-50 毫秒左右的延迟，以便人们可以在切换到初始化屏幕之前真正看到发生了什么。激活它的按钮转到以下功能：

function gameinit() {
    for (k = 0; k <=1; k += 0.125) {
        setTimeout(function () {
            var nexttxt = "Loading... " + toString(100 * k) + "%"
        }, 20);
        displayupdate(nexttxt);
    }
}

然而，当我使用 JShint 时，这是一个不正确的语法（在 JSfiddle - https://jsfiddle.net/YoshiBoy13/xLn7wbg6/2/） - 特别是第四行和第五行。我已经查看了这方面的指南，似乎一切都井井有条。我做错了什么？

（注意：displayupdate(nexttxt) 用下一行文本更新

标签）

执行脚本时，没有任何反应 - HTML 上的十六行文本正常向上移动，前八行被 gameinit() 函数生成的八行替换，但 gameinit( ) 只生成空白。如果脚本再次执行，它只输出八行 112.5%（好像是 for 循环的第 9 次迭代）。

我几乎可以肯定这是我错过的一些基本知识，有人可以告诉我我做错了什么吗？

Answer 1

使用setInterval() instead, you can clear interval using clearInterval()

function gameinit() {
  displayupdate("Loading... 0%");
  var k = 0;
  var inter = setInterval(function() {
    if (k < 1) {
      k += .25;
      displayupdate("Loading... " + 100 * k + "%")
    } else {
      clearInterval(inter);
    }
  }, 2000);
}

function displayupdate(d) {
  console.log(d);
}

gameinit();

Answer 2

setTimeout 不能像您期望的那样在循环内工作。您必须为传递给 setTimeout 的每个循环变量创建一个闭包，或者创建一个新函数来执行 setTimeout 操作。

function gameinit() {
    for (var k = 0; k <= 1; k += 0.125) {
        doSetTimeOut(k);
    }
}

function doSetTimeOut(k) {
    setTimeout(function() {
        var nexttxt = "Loading... " + toString(100 * k) + "%"
    }, 20);
    displayupdate(nexttxt);
}

Answer 3

这里有另一个函数可以做得更好---- setInterval

   var txt = '';
   var time = 0; 
   var id = setInterval(function(){
      console.log("loading..."+time/8*100+"%");
      if(time++>7)
         clearInterval(id);
   },1000);

setTimeout 语法不正确

Incorrect syntax on setTimeout

html

javascript

jquery

function

settimeout