jQuery nasconde automaticamente l'elemento dopo 5 secondi

È possibile nascondere automaticamente un elemento in una pagina Web 5 secondi dopo il caricamento del modulo utilizzando jQuery?

Fondamentalmente, ho

<div id="successMessage">Project saved successfully!</div>

che vorrei sparire dopo 5 secondi. Ho esaminato l'interfaccia utente di jQuery e l'effetto nascondi, ma ho qualche problema a farlo funzionare nel modo desiderato.

<script type="text/javascript">
        $(function() {
            function runEffect() {

                var selectedEffect = 'blind';

                var options = {};

                $("#successMessage").hide(selectedEffect, options, 500);
            };

            $("#successMessage").click(function() {
                runEffect();
                return false;
            });
        });
    </script>

Vorrei rimuovere la funzione click e aggiungere un metodo di timeout che richiami runEffect () dopo 5 secondi.

$(function() {
    // setTimeout() function will be fired after page is loaded
    // it will wait for 5 sec. and then will fire
    // $("#successMessage").hide() function
    setTimeout(function() {
        $("#successMessage").hide('blind', {}, 500)
    }, 5000);
});

Nota : per far funzionare la funzione jQuery all'interno di setTimeout, dovresti avvolgerla all'interno

function() { ... }

$('#selector').delay(5000).fadeOut('slow');

Puoi provare :

setTimeout(function() {
  $('#successMessage').fadeOut('fast');
}, 30000); // <-- time in milliseconds

Se hai usato questo, il tuo div sarà nascosto dopo 30 sec. Ho provato anche questo e ha funzionato per me.

Tieni presente che potrebbe essere necessario visualizzare nuovamente il testo div dopo che è scomparso. Quindi dovrai anche svuotare e poi mostrare nuovamente l'elemento ad un certo punto.

Puoi farlo con 1 riga di codice:

$('#element_id').empty().show().html(message).delay(3000).fadeOut(300);

Se stai usando jQuery non hai bisogno di setTimeout, almeno per non nascondere automaticamente un elemento.

Usi setTimeout sulla funzione runEffect:

function runEffect() {
    setTimeout(function(){
        var selectedEffect = 'blind';
        var options = {};
        $("#successMessage").hide(selectedEffect, options, 500)
     }, 5000);
}

Penso che potresti anche fare qualcosa come ...

setTimeout(function(){
    $(".message-class").trigger("click");
}, 5000);

e fai i tuoi effetti animati sul clic dell'evento ...

$(".message-class").click(function() {
    //your event-code
});

Saluti,

jQuery (". success_mgs"). show (); setTimeout (function () {jQuery (". success_mgs"). hide ();}, 5000);

In questo modo è possibile impostare il timeout dopo aver fatto clic.

$(".selectorOnWhichEventCapture").on('click', function() {
    setTimeout(function(){
        $(".selector").doWhateverYouWantToDo();
    }, 5000);
});

// 5000 = 5 sec = 5000 milisec