Javascript隐藏div并使用简单的倒计时显示另一个div

有没有办法隐藏div并使用javascript显示另一个div

<div class="div1">"here must show countdown 10 seconds"</div>
<div class="div2">"show this div after countdown"</div>

“此处必须显示倒计时10秒”
“在倒计时后显示此div”

例如：加载页面时，必须显示div1，并且必须有10秒的倒计时。完成倒计时后，隐藏div1并显示div2

谢谢你回答我的问题

谢谢你的RTPMatt回复了我一次，但没用。

你可以试试这个：

$(function (){
 $("#div1").show();
 setTimeout(function(){$("#div1").hide(); $("#div2").show();},10*1000)
}) 

加载dom时，将显示

div1

。然后启动一个计时器，当脉冲出现时，隐藏

div1

并显示

div2

您可以尝试以下操作：

$(function (){
 $("#div1").show();
 setTimeout(function(){$("#div1").hide(); $("#div2").show();},10*1000)
}) 

加载dom时，将显示

div1

。然后你启动一个计时器，当脉冲出现时，它会隐藏

div1

并显示

div2

请尝试此方法

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

变量超时，间隔
var阈值=10000；
var secondsleft=阈值；
window.onload=函数（）
{
startschedule（）；
}
函数启动检查（）
{
第二个SLEFT-=1000；
document.querySelector（“.div1”）.innerHTML=“在”+Math.abs（（secondsleft/1000））中激活+“秒”；
如果（secondsleft==0）
{
//document.getElementById（“clickme”）.style.display=“”；
间隔时间；
document.querySelector（“.div1”）.style.display=“无”；
document.querySelector（“.div2”）.style.display=“”；
}
}
函数startschedule（）
{
间隔时间；
secondsleft=阈值；
document.querySelector（“.div1”）.innerHTML=“在”+Math.abs（（secondsleft/1000））中激活+“秒”；
间隔=设置间隔（函数（）
{
startChecking（）；
},1000)              
}
函数resetTimer（）
{
startschedule（）；
}
“此处必须显示倒计时10秒”
“在倒计时后显示此div”

请试试这个

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

变量超时，间隔
var阈值=10000；
var secondsleft=阈值；
window.onload=函数（）
{
startschedule（）；
}
函数启动检查（）
{
第二个SLEFT-=1000；
document.querySelector（“.div1”）.innerHTML=“在”+Math.abs（（secondsleft/1000））中激活+“秒”；
如果（secondsleft==0）
{
//document.getElementById（“clickme”）.style.display=“”；
间隔时间；
document.querySelector（“.div1”）.style.display=“无”；
document.querySelector（“.div2”）.style.display=“”；
}
}
函数startschedule（）
{
间隔时间；
secondsleft=阈值；
document.querySelector（“.div1”）.innerHTML=“在”+Math.abs（（secondsleft/1000））中激活+“秒”；
间隔=设置间隔（函数（）
{
startChecking（）；
},1000)              
}
函数resetTimer（）
{
startschedule（）；
}
“此处必须显示倒计时10秒”
“在倒计时后显示此div”

我祝你万事如意。上面的代码工作得很好。非常感谢，嘿。我已经在youtube iframe上尝试了上面的代码，这里的链接是我如何在倒计时的同时加载视频。当倒计时开始时，它会像背景一样播放。有没有办法在倒计时结束后加载iframe？它必须加载iframe并在倒计时0后播放。在显示iframe时，将所需的url放在iframe的src属性中，希望有帮助！谢谢你抽出时间回答我，我真的很感激。你们所有的代码对我来说都很好，但我只是在最后一步被困在这里。选中第一个链接，如果我通过单击“视频1”和“视频2”切换视频，它将起作用。但是，当我添加代码时，切换视频将不起作用。下面是阻止切换视频的代码。我不知道发生了什么问题，请尝试更新jquery路径，但这不起作用。用我的祝福祝你好运在世界上。上面的代码工作得很好。非常感谢，嘿。我已经在youtube iframe上尝试了上面的代码，这里的链接是我如何在倒计时的同时加载视频。当倒计时开始时，它会像背景一样播放。有没有办法在倒计时结束后加载iframe？它必须加载iframe并在倒计时0后播放。在显示iframe时，将所需的url放在iframe的src属性中，希望有帮助！谢谢你抽出时间回答我，我真的很感激。你们所有的代码对我来说都很好，但我只是在最后一步被困在这里。选中第一个链接，如果我通过单击“视频1”和“视频2”切换视频，它将起作用。但是，当我添加代码时，切换视频将不起作用。下面是阻止切换视频的代码。我不知道发生了什么问题，请尝试更新jquery路径，但这不起作用。谢谢你的回答，但是Hemant代码对我有用。感谢您的时间，谢谢您的回答，但Hemant的代码为我工作。谢谢你的时间