setTimeout延迟不起作用

Question

我试图绕过头setTimeout,但我不能让它正常工作.

我在这里建立了一个例子:http://jsfiddle.net/timkl/Fca2n/

我希望在点击一个锚点后对文本进行倒计时 - 但是我setTimeout似乎同时触发,即使我已将延迟设置为1秒.

这是我的HTML:

<a href="#">Click me!</a>

<span id="target"></span>

这是我的JS:

$(document).ready(function() {


function foo(){

    writeNumber = $("#target");

    setTimeout(writeNumber.html("1"),1000);
    setTimeout(writeNumber.html("2"),1000);
    setTimeout(writeNumber.html("3"),1000);
    };

$('a').click(function() {
 foo();
});

});

任何关于我可能做错的提示都非常感谢:)

Answer 1

setTimeout将函数作为参数.您正在执行该函数并将结果传递给setTimeout(因此该函数会立即执行).您可以使用匿名函数,例如:

setTimeout(function() {
    writeNumber.html("1");
}, 1000);

请注意,同样如此setInterval.

Answer 2

你需要将你的陈述包装在匿名函数中,并且还要错开你的时间 -

setTimeout(function(){writeNumber.html("1")},1000);
setTimeout(function(){writeNumber.html("2")},2000);
setTimeout(function(){writeNumber.html("3")},3000);

如果将所有内容设置为1000步骤将几乎同时运行,因为setTimeout在上一次调用setTimeout函数完成后调用函数不是1秒后,函数将运行任务1秒.

演示 - http://jsfiddle.net/JSe3H/1/