在delay()函数之间运行jquery函数

Question

成功调用ajax后，我有jquery打开toast函数：

function successMessage() {
$("#toast_success").show("slow").delay(3000).hide("slow");
}

有些人可能想在3秒前结束祝酒[延迟(3000(]：

$(".toast_close").on('click', function() {
$("#toast_success").hide("slow");
});

不幸的是，点击事件不起作用，消息在3秒钟后消失，仅此而已。有什么建议如何使"$(".toast_close").on('click', function()"起作用吗？

Answer 1

问题是因为delay()调用仍在动画队列中。使用时间参数调用hide()方法时，也将使用动画队列。因此，hide()被阻塞，直到delay()结束。

要解决此问题，请使用不带参数的hide()(尽管这可能会在您的UI中引起不适(，或者在调用hide():之前调用stop(true)清除动画队列

$(".toast_close").on('click', function() {
$("#toast_success").stop(true).hide("slow");
});

Answer 2

.delay((方法允许我们延迟队列中跟随它的函数的执行。所以我们需要停止动画队列。对于停止动画，我们使用stop(true(或stop((方法，然后慢慢隐藏。

$(".toast_close").on('click',function(){  
$("#toast_success").stop().hide("slow");
});