Question

代码：

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(i++);
  }, 1000);
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 2000);
}

我的问题是$("#Time").html(i++)总是0而不是递增

Answer 1

<!DOCTYPE html>
<html>
<head>
<script type = 'text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script>
(function startTimer() {//selef executing function
 var i = 0;
 var TimeInterval = setInterval(function () {
    $("#button").html(i++);
   }, 1000);
   })()//end of function
</script>
</head>
<body>
 <p id='button'></p>
 </body> 
</html>

设置超时应该从你的代码中删除然后它将工作。请参阅上面的代码。它工作

Answer 2

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(++i);
  }, 1000); // This will run every 1000ms == 1s
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 2000); // This is 2000 ms == 2s. 120000ms is 2min
}

我只是将i++更改为++i - 但差异可能就是您想要的。

使用i++，首先评估i，然后递增 - 使用++i，首先递增i，然后进行评估。

Answer 3

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(i++);
  }, 1000);
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 120000);
}

此代码每秒递增html，直到2分钟为止：）

Answer 4

我认为只需一次重新安排的超时，这是最简单的：

function countForTwoMins() {
    var count = 1,
        timer = function () {
            $("#Time").html(count++);
        };
    window.setTimeout(function() {
        timer();
        if (count < 120) {
            window.setTimeout(arguments.callee, 1000);
        }
    }, 1000);
}

countForTwoMins();

http://jsfiddle.net/ybyu5/

当然，如果你关心arguments.callee被弃用：

function countForTwoMins() {
    var count = 1,

    function callback () {
        $("#Time").html(count++);
        if (count < 120) {
            window.setTimeout(callback, 1000);
        }
    }        
    window.setTimeout(callback, 1000);
}

javascript setInterval计时器问题

4 个答案: