jQuery автоматично приховувати елемент через 5 секунд

Чи можна автоматично приховати елемент на веб-сторінці через 5 секунд після завантаження форми за допомогою jQuery?

В основному я маю

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

що я хотів би зникнути через 5 секунд. Я розглянув інтерфейс jQuery та ефект приховування, але у мене є невеликі проблеми з тим, щоб він працював так, як я хочу.

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

                var selectedEffect = 'blind';

                var options = {};

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

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

Я б хотів, щоб функцію клацання було видалено та додати метод очікування, який викликає runEffect () через 5 секунд.

$(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);
});

Примітка : Для того, щоб змусити функцію jQuery працювати всередині setTimeout, слід загорнути її всередину

function() { ... }

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

Ви можете спробувати :

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

Якщо ви використовували це, ваш div буде приховано через 30 секунд. Я також спробував цей, і він спрацював для мене.

Зверніть увагу, можливо, вам доведеться знову відображати div-текст після того, як він зникне. Отже, вам також потрібно буде спорожнити, а потім знову показати елемент у певний момент.

Ви можете зробити це за допомогою 1 рядка коду:

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

Якщо ви використовуєте jQuery, вам не потрібен setTimeout, принаймні, щоб не приховувати елемент автоматично.

Ви використовуєте setTimeout для функції runEffect:

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

Думаю, ви також можете зробити щось на зразок ...

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

і зробіть свої анімовані ефекти на клік події ...

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

Вітаю,

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

Ось як ви можете встановити час очікування після натискання.

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

// 5000 = 5сек = 5000 мілісек