`DEMO`

Question

我有一个包含一些内容的页面。当它打开时，我想只显示第一个div，并在5秒后通过计时器加载所有其他div。怎么做？

代码示例：

    <div id="first_loaded"></div>
    <div id="loaded_after_5sec"></div>

Answer 1

使用classes代替id，因为您有多个div。

<强> CSS

.loaded_after_5sec { display:none; }

<强> HTML

<div class="first_loaded">First</div>
<div class="loaded_after_5sec">Second</div>
<div class="loaded_after_5sec">Third</div>

<强> JS

setTimeout(function () {
  $('.loaded_after_5sec').show();
}, 5000);

Fiddle

Answer 2

编辑感谢Andy！ 将您的ID标记更改为类标记。

这将在使用计时器显示之前隐藏对象。

$(document).ready(function(){
        $(".loaded_after_5sec").hide();
    });

setTimeout(function(){
    $(".loaded_after_5sec").show();
}, 5000);

我怎么更喜欢以下内容来隐藏对象：

<强> CSS

.loaded_after_5sec {display:none;}

Answer 3

`DEMO`

您需要使用.setTimeout，.setInterval将每隔 5秒执行，这不是您想要的。

JS代码 -

// On document ready, hide the div $(document).ready(function(){ $("#loaded_after_5sec").hide(); }); // After 5 seconds (5000 ms), show it setTimeout(function(){ $("#loaded_after_5sec").show(); }, 5000);

正如@Andy在评论中指出的那样，使用.loaded_after_5sec代替#loaded_after_5sec

用计时器加载内容？

3 个答案:

`DEMO`