Question

根据.delay()上的jQuery文档，

.delay（）方法最适合在排队的jQuery之间延迟效果。因为它是有限的 - 例如，它没有提供一种方法取消延迟-.delay（）不是JavaScript本机的替代品 setTimeout函数，可能更适合某些用途例。

请有人请详细说明吗？何时更适合使用.delay()，何时使用.setTimeout()更好？

Answer 1

我认为你发布的内容真的很有用。

将.delay()用于jQuery效果，包括动画。

setTimeout()最适合用于其他一切。例如，当您需要在某个经过的时间触发事件时。

Answer 2

据我所知，.delay()专门用于在给定jQuery队列中的方法之间添加延迟。例如，如果您希望在1秒的时间内将图像淡入视图，让它可见5秒钟，然后再花一秒钟将其淡出视图，您可以执行以下操作：

$('#image').fadeIn(1000).delay(5000).fadeOut(1000);

在这种情况下，.delay()更直观，因为它专门用于延迟给定jQuery队列中的事件。另一方面，setImeout()是一种本地JavaScript方法，并非明确用于队列行。如果您希望在单击按钮后弹出警报框1秒钟，则可以执行以下操作：

function delayAlert() {
    var x = setTimeout("alert('5 seconds later!')", 5000);
}

<input type="submit" value="Delay!" onclick="delayAlert();" />

Answer 3

.delay()主要用于将动画效果链接在一起，两者之间有暂停。

正如文档所述，没有办法取消延迟。在您可能要取消延迟的情况下，应使用setTimeout()，以便您可以使用clearTimeout()

取消

Answer 4

您可以将delay与动画结合使用，例如：

$('.message').delay(5000).fadeOut();

您还可以使用timeOut来延迟动画的开始，例如：

window.setTimeout(function(){
  $('.message').fadeOut();
}, 5000);

如您所见，动画使用delay比setTimeout更容易。

您可以使用setTimeout延迟任何内容，但只能使用delay延迟动画。非动画的方法不受delay的影响，因此在隐藏元素之前不会等待一段时间，它会立即隐藏它：

$('.message').delay(5000).hide();

Answer 5

延迟（）的另一个副作用：它似乎禁用隐藏（或fadeOut等）对象被延迟的能力，直到延迟结束。

例如，我设置了以下代码（可能是stackoverflow开发人员将识别css名称....）来隐藏'div'：

 $j(document).ready(function(){
   var $messageDiv = $j("<div>").addClass('fading_message')
       .text("my alert message here").hide();
   var $closeSpan = $j("<span>").addClass('notify_close').text("x");
   $closeSpan.click(function() {$j(this).parent().slideUp(400);});
   $messageDiv.append($closeSpan);
   $j('.content_wrapper_div').prepend($messageDiv);
   $messageDiv.fadeTo(500, .9).delay(5000).fadeTo(800,0);
 });

单击跨度中的“x”（位于“div”中）确实触发了单击功能（我在那里测试了警报），但div没有按指示滑动。但是，如果我用这个替换最后一行：

     $messageDiv.fadeTo(500, .9);

..然后它确实有效 - 当我点击“x”时，周围的div slideUp然后离开。似乎$ messageDiv上的“delay（）”函数的后台运行“锁定”了该对象，因此尝试关闭它的单独机制在延迟完成之前无法执行此操作。

.delay（）和.setTimeout（）

5 个答案: