jQuery: append() objet, remove() avec delay()

quel est le problème avec ça?jQuery: append() objet, remove() avec delay()

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

Je souhaite ajouter un message de réussite à mon document html, mais uniquement pendant 2 secondes. Après cela, la div devrait être supprimé à nouveau.

qu'est-ce que je fais mal ici?

concernant

Source

2010-09-07 matt

Utilisation setTimeout() directement (ce qui .delay() utilise en interne) est plus simple ici, puisque .remove() n'est pas une fonction mis en attente, dans l'ensemble, il devrait ressembler à ceci:

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

You can give it a try here.

.delay() est pour l'animation (ou tout autre nom) file d'attente pour l'utiliser, vous auriez à faire quelque chose comme:

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

Which works, here ... mais est tout simplement surpuissant et terriblement inefficace, pour l'amour de chaînage IMO. Normalement, vous devrez également appeler dequeue ou la fonction suivante, mais puisque vous supprimez l'élément de toute façon ...

Source

2010-09-07 03:55:14

+1 toujours fournir de bonnes réponses jquery similaires à celle que vous avez fournie f ou moi plus tôt ... –

@ Shog9 - Pour être * complètement * précis ce ne sont pas * simplement * des animations, c'est juste * par défaut * les animations de file d'attente 'fx' s'exécutent, mais il peut y avoir n'importe quelle file si passé un nom :) –

Woops, a supprimé ce commentaire depuis que vous avez mis à jour votre réponse. Mais vous avez raison, le support de la file d'attente est assez général, et pourrait être utilisé pour d'autres choses - les animations par défaut. – Shog9

Peut-être que j'utilise un jQuery obsolète, mais aucune des méthodes suggérées dans d'autres réponses semble fonctionner pour moi. Selon http://api.jquery.com/delay/, le retard est pour les effets d'animation.

En utilisant setTimeout() cependant, fonctionne bien pour moi:

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

Source

2010-09-07 03:58:29 WSkid

Ne pas passer une chaîne à 'setTimeout()' !, passer une fonction anonyme :) –

Et juste pour le plaisir, vous pouvez faire ce qui suit, en utilisant retard:

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

Source

2010-09-07 04:00:55 Strelok

Cela supprimera presque certainement l'élément avant même qu'il ait été montré ... – Shog9

@ Shog9. Tu as raison. Je l'ai juste fait travailler dans un jsfiddle ... doit avoir été un extrait différent. Bizarre. – Strelok

Vous êtes arrivé à trébucher à travers cette question et répondre quand vous cherchez setTimeout et vu que vous êtes toujours actif. Je ne sais pas si vous pourriez le faire en 2010, mais de nos jours, vous pouvez utiliser une fonction comme second paramètre dans votre fonction de masquage. Donc, juste pour les coups de pied, vous pouvez faire '$ ('. Message'). Show ('fast'). Delay (2000) .hide ('fast', function() {$ ('. Message'). Remove()}); '=) – timo

Je pense que bonne façon de le faire est pour utiliser la méthode de file d'attente jQuery:

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

Source

2017-02-04 16:36:22

jQuery: append() objet, remove() avec delay()

Répondre

Questions connexes