элемент автохайда 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>

Я бы хотел, чтобы функция click была удалена и добавила метод timeout, который вызывает runEffect () после 5 считанные секунды.

mucho gracias!

7 82
jquery jquery-ui-sortable

7 ответов:

$(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() { ... }
99
$('#selector').delay(5000).fadeOut('slow');
185

можно попробовать :

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

Если вы использовали это, то ваш div будет скрываться через 30 сек. я также попробовал это, и это сработало для меня.

7

вы используете setTimeout на вас runEffect функции:

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

Я думаю, вы также могли бы сделать что-то вроде...

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

и сделать ваши анимированные эффекты на событие-нажмите...

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

С ПРИВЕТОМ,

1

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

вы можете сделать это с 1 строкой кода:

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

Если вы используете jQuery, вам не нужно setTimeout, по крайней мере, не для автоматического скрытия элемента.

1

Это, как вы можете установить тайм-аут после нажатия кнопки.

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

/ / 5000 = 5sec = 5000 milisec

0