4

我想知道的是,是否有一种很好的方法可以让 jQuery 函数在一段时间后执行。这不会暂停其他函数的执行,只会暂停链中后续函数的执行。也许我设想的一个例子可以说明:

$('#alert')
    .show()
    .wait(5000)    // <-- this bit
    .hide()
;

我知道可以通过使用超时来实现,但这似乎是一种混乱的方式,尤其是与上面的示例相比(如果它是真实的)。

那么,这样的东西是否已经内置到 jQuery 中,如果没有,模拟它的最佳方法是什么?

4

2 回答 2

8

你不能这样做,而且你可能不想这样做。虽然它看起来确实很漂亮,但 Javascript 中没有任何机制可以让您做到这一点,而无需在“等待”中循环直到时间过去。您当然可以这样做,但您可能会严重降低浏览器的性能,并且如果您的超时时间超过几秒钟,浏览器将向用户显示您的 javascript 似乎被卡住的警告。

正确的方法是使用超时:

var el = $('#alert');
el.show()
setTimeout(function() { el.hide() }, 5000);

您的另一个选择是扩展 jquery 实质上为您想要延迟的操作添加效果:

jQuery.fn.extend({
    delayedHide: function(time) {
        var self = this;
        setTimeout(function() { self.hide(); }, time);
    }
});

$('#alert')
    .show()
    .delayedHide(5000)
;

您还可以使用类似于 setTimeout 的方法扩展 jquery:

jQuery.fn.extend({
    delayThis: function(fn, time, args) {
        var self = this;
        setTimeout(function() { jQuery.fn[fn].apply(self, args); }, time);
    }
});

$('#alert')
    .show()
    .delayThis('hide', 5000)
;

或使用 args 调用在数组中传递参数:

$('#alert')
    .show()
    .delayThis('css', 5000, [ 'display', 'none' ])
;
于 2008-09-18T01:02:23.460 回答
1

jQuery FxQueues 插件可以满足您的需要:

$('#element').fadeOut({
    speed: 'fast',
    preDelay: 5000
});
于 2008-09-18T03:38:54.283 回答