setTimeout带有字段更新的循环问题 [英] setTimeout with loop issue with field update

问题描述

我正在尝试遍历计时器上的列表(当前为1秒，但我希望更快).问题在于当前值无法通过视觉方式进行更新&；我不明白为什么.

I'm trying to loop through a list on a timer (currently 1 second but I want it faster). The problem is that the current value isn't being updated visually & I can't see why.

当我循环使用 Firebug 时，它正常工作，但是没有firebug时，它没有显示文本更改...是否以某种方式跳过了文本更新?

When I loop through with Firebug it works as intended but without firebug it's not showing the text change...is it skipping the text update somehow?

我将计时器设置为1秒；当然，.html()调用不会花费更长时间?感谢您提供任何信息.

I set the timer to 1 second; surely a .html() call wouldn't take longer? Thanks for any info.

我的HTML很简单:

<div id="winner2"><h1></h1></div>
<div id="button"">
<img id="start" src="start.png" />
<img id="stop" src="stop.png" />
</div>

我的JS是:

var people = ["a", "b", "c"];
        var counter = 1;
        var run;
        $(document).ready(function(){ 
        $("#winner2 h1").html("a");
        $("#stop").hide();

        $( "#start" ).click(function() {
            $("#start").hide();
            $("#stop").show();
            run = setTimeout (nameIncrement(),1000);
        });

        $( "#stop" ).click(function() {
            $("#stop").hide();
            $("#start").show();
            clearTimeout(run);
        });

        function nameIncrement() {
            if(counter == people.length) {
                counter=0;
            }       
            $("#winner2 h1").html(people[counter]);
            counter++;
            run = setTimeout (nameIncrement(),1000);
        }       
        }); 

推荐答案

您正在调用nameIncrement()并将其返回值传递给setTimeout()，而不是传递nameIncrement.

You are calling nameIncrement() and passing its return value to setTimeout(), rather than passing nameIncrement.

删除括号:

run = setTimeout(nameIncrement, 1000);

jsfiddle

这篇关于setTimeout带有字段更新的循环问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！