jQuery: добавить() объект, удалить () его с задержкой()

что в этом плохого?

$('body').append("<div class='message success'>Upload successful!</div>");
$('.message').delay(2000).remove();

Я хочу добавить сообщение об успехе в мой html-документ, но только для 2sec. После этого div следует снова удалить.

что я здесь делаю не так?

в отношении

34
append delay jquery

4 ответов

используя setTimeout() напрямую (который .delay() использует внутренне) здесь проще, так как .remove() не является функцией очереди, в целом она должна выглядеть так:

$('body').append("<div class='message success'>Upload successful!</div>");
setTimeout(function() {
  $('.message').remove();
}, 2000);

вы можете попробовать здесь.

.delay() для анимации (или какой-либо названной) очереди, чтобы использовать ее, вам нужно будет сделать что-то вроде:

$("<div class='message success'>Upload successful!</div>").appendTo('body')
  .delay(2000).queue(function() { $(this).remove(); });

который работает, здесь...но это просто излишне и ужасно неэффективно, ради цепи ИМО. Обычно вам также нужно вызвать dequeue или следующую функцию, но так как вы все равно удаляете элемент...

88

Я думаю, что правильный способ сделать это-использовать метод очереди на jQuery:

    $("<div class='message success'>Upload successful!</div>")
        .appendTo('body')
        .delay(2000)
        .queue(function() {
            $(this).remove();
        });
4

возможно, я использую устаревший jQuery, но ни один из методов, предложенных в других ответах, не работает для меня. Согласно http://api.jquery.com/delay/, задержка для эффектов анимации.

используя setTimeout() тем не менее, хорошо работает для меня:

$('body').append("<div class='message success'>Upload successful!</div>"); 
setTimeout(function(){
    $(".message").remove();
}, 2000);
2

и просто для пинки, вы можете сделать следующее, используя delay:

$('body').append("<div class='message success'>Upload successful!</div>");
$('.message').show('fast').delay(2000).hide('fast')
$('.message').remove();
0