jquery 定时

jQuery 定时操作

jQuery 提供了多种方法来实现定时操作，包括延迟执行、循环执行等。以下是几种常见的 jQuery 定时方法：

setTimeout 与 clearTimeout

使用 setTimeout 可以延迟执行代码，clearTimeout 用于取消延迟执行。

// 延迟 2 秒后执行
var timer = setTimeout(function() {
    alert("延迟 2 秒执行");
}, 2000);

// 取消延迟执行
clearTimeout(timer);

setInterval 与 clearInterval

使用 setInterval 可以循环执行代码，clearInterval 用于停止循环。

// 每隔 1 秒执行一次
var interval = setInterval(function() {
    console.log("每隔 1 秒执行一次");
}, 1000);

// 停止循环执行
clearInterval(interval);

jQuery 的 delay 方法

jQuery 的 delay 方法主要用于动画队列中的延迟，通常与 queue 或动画方法（如 fadeIn）一起使用。

// 延迟 1 秒后淡入元素
$("#element").delay(1000).fadeIn();

使用 jQuery 的动画回调

jQuery 的动画方法（如 fadeIn、slideUp）支持回调函数，可以在动画完成后执行代码。

// 淡入完成后执行回调
$("#element").fadeIn(500, function() {
    alert("淡入完成");
});

自定义定时函数

可以结合 jQuery 和原生 JavaScript 实现更复杂的定时逻辑。

function customTimer(callback, delay, repeat) {
    var timer = setInterval(function() {
        callback();
        if (!repeat) clearInterval(timer);
    }, delay);
    return timer;
}

// 使用示例
var timer = customTimer(function() {
    console.log("自定义定时器");
}, 1000, true);

// 停止定时器
clearInterval(timer);

注意事项

• 使用 setTimeout 和 setInterval 时，注意清理定时器以避免内存泄漏。
• jQuery 的 delay 方法仅适用于动画队列，不适用于普通代码延迟。
• 在页面卸载时（如跳转或刷新），建议清理所有定时器。