Как скрыть div через некоторое время?

Мне нужно скрыть div (например, «почта успешно отправлена» в Gmail) через определенный период времени, когда я перезагружаю страницу.

Как я могу это сделать?


html jquery fadeout
person rag    schedule 11.03.2010    source источник

Ответы (3)


arrow_upward
100
arrow_downward

Вот полный рабочий пример, основанный на вашем тестировании. Сравните это с тем, что у вас есть сейчас, чтобы понять, где вы ошибаетесь.

<html> 
  <head> 
    <title>Untitled Document</title> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript"> 
      $(document).ready( function() {
        $('#deletesuccess').delay(1000).fadeOut();
      });
    </script>
  </head> 
  <body> 
    <div id=deletesuccess > hiiiiiiiiiii </div> 
  </body> 
</html>
person rosscj2533    schedule 11.03.2010

arrow_upward
45
arrow_downward

В более старых версиях jquery вам придется делать это «путем javascript», используя settimeout

setTimeout( function(){$('div').hide();} , 4000);

or

setTimeout( "$('div').hide();", 4000);

Недавно с jquery 1.4 добавлено это решение:

$("div").delay(4000).hide();

Конечно, замените "div" правильным элементом, используя допустимый селектор jquery, и вызовите функцию, когда документ готов.

person marcgg    schedule 11.03.2010
comment
Причина в том, что функция setTimeout ожидает в качестве первого параметра либо функцию, либо строку. Вы не предоставляете ни того, ни другого, вы ВЫПОЛНЯЕТЕ функцию, а возврат этой функции — это то, что вы отправляете функции setTimeout. Это будет работать, если вы передадите саму функцию, например: setTimeout( $( "#div" ).hide, 4000 );. - person Jacob Relkin; 11.03.2010
comment
@jacob: отредактировал мой ответ, я думаю, что примеры, которые я привожу, должны работать нормально - person marcgg; 11.03.2010
comment
Не говоря уже о том, что передача строки менее эффективна, чем передача функции, потому что она заставляет функцию exec анализировать функцию. - person Jacob Relkin; 11.03.2010
comment
‹html › ‹head› ‹title›Документ без названия‹/title› ‹script type=text/javascript› $('#deletesuccess').delay(1000).fadeOut(); ‹/script› ‹/head› ‹body› ‹div id=deletesucess › hiiiiiiiiii ‹/div› ‹/body› ‹/html› Я пробовал этот код, но не работает? Пожалуйста, скажите, что это за pblm для этого кода... . - person rag; 11.03.2010
comment
@jacob правда о исполнительной части. Я сомневаюсь, что это будет иметь большое значение в конце... потому что, если мы начнем так, мы можем утверждать, что определение функции на лету требует больше битов и будет дольше загружаться. Я бы сказал, что производительность здесь не проблема, поэтому OP может использовать любой синтаксис, который ему больше нравится (хотя я бы рекомендовал использовать function()...) - person marcgg; 11.03.2010
comment
@rag - во-первых, вы не загружаете туда jQuery. - person Kobi; 11.03.2010
comment
@rag также вы не загружаете jquery, как упоминал @kobi - person marcgg; 11.03.2010
comment
‹html› ‹head› ‹title›Документ без названия‹/title› ‹script type=text/javascript src=jquery-1.3.2.min.js› ‹/script› ‹script type=text/javascript› $('# удалить успех').delay(1000).fadeOut(); ‹/script› ‹/head› ‹body› ‹div id=deletesucess › хииииииииии ‹/div› ‹/body› ‹/html› я включил kobi, но он не работает.. - person rag; 11.03.2010
comment
@rag: У вас опечатка: deletesuccess в селекторе, но deletesucess в id. - person rosscj2533; 11.03.2010
comment
@rag: проверьте свой синтаксис, опечатки и так далее. уважайте действительный xhtml и т. д., а также - person marcgg; 11.03.2010
comment
Uncaught SyntaxError: неожиданный идентификатор /jqury/jquery-1.4.2.min.js:77 timehidediv.php:8Uncaught ReferenceError: $ не определен/это новые ошибки, когда я пробовал jquery 1.4.2 - person rag; 11.03.2010
comment
ты дер маркгг? Забудь меня, если опоздал..:) - person rag; 11.03.2010
comment
‹html› ‹head› ‹title›Документ без названия‹/title› ‹script type=text/javascript src=jquery-1.4.2.min.js› ‹/script› ‹script type=text/javascript› $(document) .ready(function(){ $('#deletesucess').delay(1000).fadeOut(); }); //setTimeout('$(#deletesucess).hide()',1500); ‹/script› ‹/head› ‹body› ‹div id=deletesucess › hiiiiiiiiii ‹/div› ‹/body› ‹/html› попробовал в готовом документе, но не удалось... - person rag; 11.03.2010
comment
@ross и @marcgg, к вашему сведению, ваш удручающий уровень обслуживания (позор вам, никакой реакции в течение 20 минут!!!) не оставил ОП другого выбора, кроме как задать тот же вопрос еще раз : stackoverflow.com/questions/2426659/ - person Pekka; 11.03.2010
comment
@rag: у вас проблема с вашим jquery, если он даже не распознает $. Попробуйте загрузить его снова и, пожалуйста, не открывайте повторяющиеся вопросы. Проверьте свои идентификаторы div и так далее. - person marcgg; 11.03.2010
comment
@rag выглядит так, будто ваш jquery сломан, поскольку @marc говорит, загрузите его снова. - person Pekka; 11.03.2010

arrow_upward
1
arrow_downward

Вы также можете использовать...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script type="text/javascript">
        $(function(){
           setTimeout(function(){
               $(".signup-success").fadeOut(1500);}, 5000);
        });
</script>
person Avro_Abir    schedule 08.05.2021