Question

所以基本上我想要显示一个倒计时，可能是从一分钟左右然后在倒计时到零时我想运行一个jQuery函数。

所以我们假设倒计时从1分钟开始。

所以我希望在用户基本上在页面上花费1分钟后运行一个名为updateEntry()的函数。我见过人们使用setTimeout，我只是简单地将函数定义放在那里或者我会在那里调用函数吗？另外，我将如何将倒计时与setTimeout

同步

Answer 1

这是一种方法：

function doCountdown(time, cb) {
    $("#countdown").text(time);
    if (time <= 0)
        cb();
    else
        setTimeout(function() {
            doCountdown(time-1, cb);
        }, 1000);
}

doCountdown(60, updateEntry);

演示：http://jsfiddle.net/Dgj63/

上面假设页面上有一个元素id="countdown"（您可以根据需要设置样式）以显示剩余的秒数，但是如果您想在同一页面上运行多个倒计时你可以将元素id作为参数传递给函数，而不是在函数内部硬编码。当然，它假设您的updateEntry()函数已定义。将代码放在页面末尾的脚本元素中，或将其包装在文档就绪处理程序中，如我的小提琴所示。

Answer 2

这是一个有效的jSFiddle：http://jsfiddle.net/ZNYX5/1/

HTML（仅举例）：

<span><span>

jQuery的：

var count = 60;

$("span").text(count);

var myTimer = setInterval(function(){
    if(count > 0){
        count = count - 1;
        $("span").text(count);
    }
    else {
       clearInterval(myTimer);
       alert("I'm done counting down!"); 
    }
},1000);

只需将alert("I'm done counting down!");更改为对您的功能的调用。

使用jQuery显示计时器并在计时器结束时运行函数

2 个答案: