jquery 延迟

jQuery 延迟执行方法

在jQuery中，延迟执行代码可以通过多种方式实现，以下是常见的几种方法：

使用setTimeout函数

通过JavaScript原生的setTimeout函数结合jQuery选择器实现延迟效果：

$(document).ready(function(){
    setTimeout(function(){
        $('#element').fadeIn();
    }, 2000); // 延迟2秒执行
});

jQuery delay()方法

jQuery提供了专门的delay()方法用于动画队列中的延迟：

$('#element').delay(1000).fadeIn(); // 延迟1秒后淡入
$('#another').delay(2000).slideDown(); // 延迟2秒后滑下

自定义延迟函数

创建可复用的延迟执行函数：

function delayedAction(selector, action, delay) {
    setTimeout(function(){
        $(selector)[action]();
    }, delay);
}
delayedAction('#target', 'fadeOut', 1500);

结合promise的延迟

使用jQuery的Deferred对象实现更复杂的延迟逻辑：

var deferred = $.Deferred();
setTimeout(function(){
    deferred.resolve();
}, 3000);

deferred.promise().done(function(){
    console.log('延迟3秒后执行');
});

动画队列延迟

利用jQuery动画队列实现顺序延迟效果：

$('#box')
    .animate({left:'+=100'}, 500)
    .delay(800)
    .animate({top:'+=50'}, 300);

注意事项：

• delay()仅适用于jQuery动画队列中的效果
• 对于非动画操作应使用setTimeout
• 延迟时间单位为毫秒（1000毫秒=1秒）
• 清除延迟可使用clearTimeout()或stop(true)停止动画队列