Javascript 在'之间添加延迟；对于'；循环迭代

我正在尝试实现基本的60秒计数器（一个id为计数器的

p

元素），它是在按下按钮（

counter\u start（）

）后触发的。但我希望这两者之间延迟1秒，并确保在浏览器窗口中实时更新

 <script type="text/javascript">

    function counter_start(){
        x=0
        for(i=0;i<60;i++){
        x++;
        document.getElementById("counter").innerHTML=x;

         }
     }


    </script>

函数计数器_start（）{
x=0
对于（i=0；i试试这个
希望它对你有用

JS

 for(i = 1; i <= 3; i++)
   {
   (function(i){
       setTimeout(function(){
         alert(i);
     }, 1000 * i);
   }(i));
} 

for（i=1；i试试这个
希望它对你有用

JS

 for(i = 1; i <= 3; i++)
   {
   (function(i){
       setTimeout(function(){
         alert(i);
     }, 1000 * i);
   }(i));
} 

for（i=1；i听起来你在寻找暂停当前线程的方法，这可能是个坏主意（暂停线程时用户的浏览器会锁定）

A确实是解决这个问题的方法，否则您将与该语言的工作方式发生冲突。
听起来您正在寻找暂停当前线程的方法，这可能是个坏主意（当线程暂停时，用户的浏览器将锁定）

A确实是解决这个问题的方法，否则您将与该语言的预期工作方式发生冲突。
Javascript在浏览器中同步运行

您需要使用
setTimeout
或
setInterval
来安排每秒调用for循环的主体。在下面的示例中，我使用
setTimeout
来简化“垃圾收集”；在不再需要更新内容之后，我们将不会重新安排勾号

<script type="text/javascript">

var counter = 0;

function counter_tick() {
    if(counter < 60) {
        counter++;
        document.getElementById("counter").innerHTML = counter;
        setTimeout(counter_tick, 1000); // Schedule next tick.
    }
}

function counter_start() {
    counter_tick(); // First update, also schedules next tick to happen.
}


</script>   


var计数器=0；
函数计数器_tick（）{
如果（计数器<60）{
计数器++；
document.getElementById（“计数器”）.innerHTML=计数器；
setTimeout（计数器刻度，1000）；//计划下一个刻度。
}
}
函数计数器_start（）{
计数器_tick（）；//第一次更新时，也会安排下一次的tick。
}
Javascript在浏览器中同步运行

您需要使用
setTimeout
或
setInterval
来安排每秒调用for循环的主体。在下面的示例中，我使用
setTimeout
来简化“垃圾收集”；在不再需要更新内容之后，我们将不会重新安排勾号

<script type="text/javascript">

var counter = 0;

function counter_tick() {
    if(counter < 60) {
        counter++;
        document.getElementById("counter").innerHTML = counter;
        setTimeout(counter_tick, 1000); // Schedule next tick.
    }
}

function counter_start() {
    counter_tick(); // First update, also schedules next tick to happen.
}


</script>   


var计数器=0；
函数计数器_tick（）{
如果（计数器<60）{
计数器++；
document.getElementById（“计数器”）.innerHTML=计数器；
setTimeout（计数器刻度，1000）；//计划下一个刻度。
}
}
函数计数器_start（）{
计数器_tick（）；//第一次更新时，也会安排下一次的tick。
}
JS中没有
sleep
-函数。但是您可以使用
window.setTimeout
在给定的时间间隔内调用函数：

function counter_start(){
    // get current value
    var value = document.getElementById("counter").innerHTML*1;
    // leave function if 60 is reached
    if(value == 60) {
         return;
    }
    // set the innerHTML to the last value + 1
    document.getElementById("counter").innerHTML=value+1;
    // call next iteration
    window.setTimeout(function(){counter_start()}, 100);
}

counter_start();

JS中没有
sleep
-函数。但是您可以使用
window.setTimeout
在给定的时间间隔内调用函数：

function counter_start(){
    // get current value
    var value = document.getElementById("counter").innerHTML*1;
    // leave function if 60 is reached
    if(value == 60) {
         return;
    }
    // set the innerHTML to the last value + 1
    document.getElementById("counter").innerHTML=value+1;
    // call next iteration
    window.setTimeout(function(){counter_start()}, 100);
}

counter_start();

For循环运行到完成，因此通常不会使用循环来完成此操作。
您只需要一个计时器和一个变量来递增：


var maketimer=function（）{
var tick=0，
间隔μms=1000，
限值=10，
身份证件
返回{
开始：函数（）{
var定时器=此；
console.log（'start'）；
id=setInterval（函数（）{
如果（勾选===限制）{
timer.stop（）；
timer.reset（）；
返回；
}
勾号+=1；
控制台日志（勾选）；
}时间间隔(毫秒),；
},
停止：函数（）{
console.log（'stop'）；
清除间隔（id）；
},
重置：函数（）{
console.log（'reset'）；
勾号=0；
}
};
};
var t=maketimer（）；
t、 start（）；
用于循环运行到完成，所以通常不会使用它。
您只需要一个计时器和一个变量来递增：


var maketimer=function（）{
var tick=0，
间隔μms=1000，
限值=10，
身份证件
返回{
开始：函数（）{
var定时器=此；
console.log（'start'）；
id=setInterval（函数（）{
如果（勾选===限制）{
timer.stop（）；
timer.reset（）；
返回；
}
勾号+=1；
控制台日志（勾选）；
}时间间隔(毫秒),；
},
停止：函数（）{
console.log（'stop'）；
清除间隔（id）；
},
重置：函数（）{
console.log（'reset'）；
勾号=0；
}
};
};
var t=maketimer（）；
t、 开始（）；
试试这个：

var x=0;
var myVar;
function myTimer() {
    x++;        
    document.getElementById("counter").innerHTML = x;
    if(x==60)
        clearInterval(myVar);
}
function counter_start(){
    myVar=setInterval(function(){myTimer()},1000);
 }

试试这个：

var x=0;
var myVar;
function myTimer() {
    x++;        
    document.getElementById("counter").innerHTML = x;
    if(x==60)
        clearInterval(myVar);
}
function counter_start(){
    myVar=setInterval(function(){myTimer()},1000);
 }

你不能延迟for循环本身，你必须实现你自己版本的for循环。你应该接受Parth的答案。你需要做的就是用
document.getElementById（“计数器”）替换
alert（i）
.innerHTML=i
您不能延迟for循环本身，您必须实现自己版本的for循环。您应该接受Parth的答案。您需要做的就是将
alert（i）
替换为
document.getElementById（“counter”）。innerHTML=i
为什么有counter\u start（）在它自己的函数内部？应该是window.setTimeout（counter_start，100）；为什么在它自己的函数内部有counter_start（）？应该是window.setTimeout（counter_start，100）；这个方法证明了对语言的理解。尼斯这个方法证明了对语言的理解。尼斯