jquery 定时器

jQuery 定时器实现方法

使用 setTimeout

setTimeout 用于在指定时间后执行一次函数。语法如下：

setTimeout(function() {
    // 执行的代码
}, delay);

示例：3秒后弹出提示框

setTimeout(function() {
    alert("时间到！");
}, 3000);

使用 setInterval

setInterval 用于每隔指定时间重复执行函数。语法如下：

setInterval(function() {
    // 执行的代码
}, interval);

示例：每隔1秒更新显示时间

setInterval(function() {
    $("#time").text(new Date().toLocaleTimeString());
}, 1000);

清除定时器

使用 clearTimeout 或 clearInterval 停止定时器：

var timer = setTimeout(...);
clearTimeout(timer);

var interval = setInterval(...);
clearInterval(interval);

jQuery 延迟方法

jQuery 的 delay() 方法可以与队列方法配合使用：

$("#box").fadeIn().delay(2000).fadeOut();

注意事项

• 定时器ID应保存到变量以便清除
• setInterval 要注意避免函数执行时间超过间隔时间
• 页面隐藏时（如切换标签页），部分浏览器会降低定时器频率

示例：倒计时功能

var count = 10;
var timer = setInterval(function() {
    $("#countdown").text(count);
    if (count-- <= 0) {
        clearInterval(timer);
        $("#message").text("倒计时结束");
    }
}, 1000);