Jquery 需要显示div 2秒钟_Jquery_Html_Css

Jquery 需要显示div 2秒钟

jquery html css

Jquery 需要显示div 2秒钟,jquery,html,css,Jquery,Html,Css,我的代码中有2个部分。我需要一个一个地展示这些部分2秒钟。请帮我 <section class="square_box tctgrid" id="question1"> <div></div> <div></div> <div></div> <div class="empty"></div> <div></div> &

我的代码中有2个部分。我需要一个一个地展示这些部分2秒钟。请帮我

<section class="square_box tctgrid" id="question1">
    <div></div>
    <div></div>
    <div></div>
    <div class="empty"></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</section>
<section class="square_box tctgrid" id="question1">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div  class="empty"></div>
</section>

使用Jquery可以等待2秒，然后按其类名隐藏元素：

setTimeout(function(){
   $('.square_box').hide();
}, 2000);

编辑

以上内容将同时隐藏这两个元素。如果您希望单独显示它们，我将首先更新html，向每个元素添加单独的ID

<section class="square_box tctgrid" id="question1">
</section>
<section class="square_box tctgrid" id="question2">
</section>

使用以下代码：
var隐藏=假；
setInterval（函数（）{
document.getElementById（“image”）.style.visibility=隐藏？“可见”：“隐藏”；
document.getElementById（“image1”）.style.visibility=隐藏？“隐藏”：“可见”；
隐藏=！隐藏；
}, 2000);

首先，不要有多个具有相同值的

id

。将类用于重用id（

id=“question1”

）是无效的。你试过什么？你的意思是交替显示，如每秒钟显示一个，然后显示另一个，还是在页面加载时显示一个，然后显示另一个，每秒钟一次？最初我需要显示一个部分。隐藏第一部分并显示下一部分好的，我已经更新了代码。首先，脚本隐藏了第二个答案。等待2秒钟，然后隐藏第一个问题并显示第二个问题。然后再等待2秒钟。最后，它隐藏了第二个问题。

<section class="square_box tctgrid" id="question1">
</section>
<section class="square_box tctgrid" id="question2">
</section>

$('#question2').hide(); // Hide the second question

setTimeout(function(){
   $('#question1').hide(); // Hide the first question
   $('#question2').show(); // Show the second question

   setTimeout(function(){
       $('#question2').hide(); // After 2s, hide the 2nd question
   }, 2000);
}, 2000);

        use this code:

            <body>
              <div align="center">
                <img id="image" src="image1.png" height="200" width="200">
             </div>
             <div align="center">
                <img id="image1" src="image1.png" height="200" width="200" style="visibility:hidden;">
             </div>
            </body>
        <script>
        var hidden = false;

        setInterval(function() {
          document.getElementById("image").style.visibility = hidden ? "visible" : "hidden";
          document.getElementById("image1").style.visibility = hidden ? "hidden" : "visible";
          hidden = !hidden;
        }, 2000);

        </script>