排队定时jquery事件无法正常工作

Question

所以我有一个空的div设置显示：none名为id =“c1”。

我正在尝试排队，以便它会淡入并说： 2秒

然后在1秒之后会说： 1秒

然后淡出，页面重定向。

$('#c1').html('2 seconds').fadeIn('fast').delay(800).html('1 second').delay(800).fadeOut('fast');

然而，当我运行它时，我只看到“1秒”并且它淡出。我根本看不到2秒的消息。就像jquery只监听最后一个“html”事件一样。

我也尝试在div中输入“2秒”作为html中的默认文本。这也行不通。页面加载后仍然会显示“1秒”。

编辑解决方案

您可以这样做：

$('#c1').html('2').fadeIn('fast').delay(800).queue(function () {$(this).html('1');$(this).dequeue();}).delay(800).fadeOut('fast');

Answer 1

你只能延迟（）动画，而不是像html（）这样的其他函数，它们会立即执行。

改为使用html（）函数的超时，或将它们放在动画回调中。

$('#c1').html('2 seconds').fadeIn(1000, function() {
   $(this).html('1 second').fadeOut(1000);
});​

Answer 2

尝试

    $('#c1').html('2 seconds')fadeIn('fast');
    setTimeout($('#c1').html('1     second'), 800);
    setTimeout($('#c1').fadeOut('fast'), 800);

Answer 3

是的，文档声明：“它可以与标准效果队列或自定义队列一起使用”，但像.html（）这样的操作不使用效果队列......