Согласно документу jQuery на .delay(),
Метод .delay() лучше всего подходит для задержки между jQuery в очереди последствия. Поскольку он ограничен - он, например, не предлагает способ отменить задержку..delay() не является заменой для родного JavaScript setTimeout, которая может быть более подходящей для определенного использования случаев.
Разве кто-то может раскрыть это? Когда более целесообразно использовать .delay(), и когда лучше использовать .setTimeout()?
Я думаю, что то, что вы опубликовали, действительно объясняет.
Используйте .delay() для эффектов jQuery, включая анимацию.
setTimeout() лучше всего использовать для всего остального. Например, когда вам нужно инициировать событие в определенное истекшее время.
Насколько я понимаю, .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();" />
.delay() в основном используется для объединения эффектов анимации с паузами между ними.
Как упоминается в документах, отменить задержку невозможно. В случае, если вы можете отменить задержку, вместо этого следует использовать setTimeout(), чтобы вы могли отменить его с помощью clearTimeout()
Вы можете использовать delay с анимацией, например:
$('.message').delay(5000).fadeOut();
Вы также можете использовать timeOut для задержки начала анимации, например:
window.setTimeout(function(){
$('.message').fadeOut();
}, 5000);
Как вы видите, проще использовать delay, чем setTimeout с анимацией.
Вы можете отложить почти все с помощью setTimeout, но вы можете откладывать анимацию только с помощью delay. Методы, которые не являются анимацией, не подвержены влиянию delay, поэтому это не подождало бы некоторое время, прежде чем скрыть элемент, он сразу скроет его:
$('.message').delay(5000).hide();
Другой побочный эффект delay(): он, по-видимому, отключает возможность скрыть (или 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 не сдвигалUp, как указано. Однако, если я заменю последнюю строку следующим:
$messageDiv.fadeTo(500, .9);
.. тогда это действительно сработало - когда я щелкнул "x", окружающий div slideUp и и прочь. Кажется, что фоновый запуск функции "delay()" в $messageDiv "заблокировал" этот объект, так что отдельный механизм, пытающийся закрыть его, не смог бы сделать это до тех пор, пока не будет выполнена задержка.