有没有办法隐藏div显示另一个使用javascript的div?
<div class="div1">"here must show countdown 10 seconds"</div>
<div class="div2">"show this div after countdown"</div>
例如:当页面加载时,div1必须显示,并且必须有10秒倒计时。当倒计时完成后,隐藏div1并显示div2
感谢谁回答我的问题。
感谢RTPMatt回答了我一次,但它没有工作。
答案 0 :(得分:2)
你可以试试这个:
$(function (){
$("#div1").show();
setTimeout(function(){$("#div1").hide(); $("#div2").show();},10*1000)
})
加载dom后,会显示div1
。然后你启动一个计时器,当脉冲时,隐藏div1
并显示div2
答案 1 :(得分:2)
请试试这个
<script language="javascript">
var timeout,interval
var threshold = 10000;
var secondsleft=threshold;
window.onload = function()
{
startschedule();
}
function startChecking()
{
secondsleft-=1000;
document.querySelector(".div1").innerHTML = "Activating in " + Math.abs((secondsleft/1000))+" secs";
if(secondsleft == 0)
{
//document.getElementById("clickme").style.display="";
clearInterval(interval);
document.querySelector(".div1").style.display="none";
document.querySelector(".div2").style.display="";
}
}
function startschedule()
{
clearInterval(interval);
secondsleft=threshold;
document.querySelector(".div1").innerHTML = "Activating in " + Math.abs((secondsleft/1000))+" secs";
interval = setInterval(function()
{
startChecking();
},1000)
}
function resetTimer()
{
startschedule();
}
</script>
<div class="div1">"here must show countdown 10 seconds"</div>
<div class="div2" style="display:none;">"show this div after countdown"</div>