logo标签列表

如何在一段时间后隐藏一个 div？

jqueryhtmlfadeout
42
我需要在页面重新加载后的一定时间内隐藏一个div元素（例如Gmail中的“邮件发送成功”提示）。
我该如何做到这一点？
5个回答
103

这是一个基于你的测试的完整可用示例。将其与你当前拥有的代码进行比较，找出你哪里做错了。

<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>
46

在早期版本的jquery中，你需要按照“JavaScript方式”使用settimeout来完成它。

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

或者

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

最近在jQuery 1.4中添加了这个解决方案：

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

当然，使用有效的jQuery选择器替换“div”，并在文档准备就绪时调用该函数。

2
原因是setTimeout函数期望它的第一个参数是一个函数或字符串。你提供的既不是函数也不是字符串，而是执行函数，然后将该函数的返回值发送给setTimeout函数。如果你传递函数本身，就像这样：setTimeout( $( "#div" ).hide, 4000 );，那么这将起作用。 - Jacob Relkin
2
@rag - 首先，你没有在那里加载jQuery。 - Kobi
@rag，你也不需要像@kobi提到的那样加载jQuery。 - marcgg
1
@rag：您有一个拼写错误：选择器中为deletesuccess，但ID中为deletesucess。 - rosscj2533
1
@ross 和 @marcgg，FYI，你们糟糕的服务水平（真丢人，20分钟没有回应！！！）让 OP 没有选择，只能再次提出同样的问题：http://stackoverflow.com/questions/2426659/hiding-a-div-with-certain-time-bound - Pekka
显示剩余11条评论
8
setTimeout('$("#someDivId").hide()',1500);
4

$().ready(function(){

  $('div.alert').delay(1500);
   $('div.alert').hide(1000);
});
div.alert{
color: green;
background-color: rgb(50,200,50, .5);
padding: 10px;
text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="alert"><p>Inserted Successfully . . .</p></div>

1

您也可以使用...

<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>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接