在x秒后显示div，并在y秒后显示另一个div

Question

我对此很新，但我试图在1秒后显示div1，并在5秒后显示div2。目前，1秒后只显示div2。请帮我修复javascript。

我还想知道在显示div2之后如何隐藏div1。

我的代码：

<div id="div1" style="visibility: hidden">Reveal Div 1 after 1 second</div>
<div id="div2" style="visibility: hidden">Reveal Div 2 after 5 seconds</div>

<script type="text/javascript">
function showIt() {
  document.getElementById("div1").style.visibility = "visible";
}
setTimeout("showIt()", 1000); // after 1 sec

function showIt() {
  document.getElementById("div2").style.visibility = "visible";
}
setTimeout("showIt()", 5000); // after 5 secs
</script>

Answer 1

你不能拥有同名的2个功能。将第二部分改为

function showIt2() {
  document.getElementById("div2").style.visibility = "visible";
}
setTimeout("showIt2()", 5000); // after 5 secs

演示：http://jsfiddle.net/W9YU5/

Answer 2

两个问题。

1. 每个功能必须具有不同的名称。
2. 您可以像setTimeout(showIt, 5000); // after 5 secs
一样调用setTimeout中的函数

<强> jsFiddle example