Question

我有div框，在这个框中是div。第一个div - 首先加载，5秒后加载第二个div。

<div style=" width: 500px; height:500px;">

<div id="first-box">Waite 5 seconds </div>
<div id="second-box"> Hi All </div>

</div>

我需要这个

的jQuery setTimeout函数

Answer 1

除非您要添加更多关于添加内容的信息。要在元素中添加5秒延迟，请输入以下代码：

您需要先使用此css隐藏元素：

.hide {
    display: none;
}

这是对你的html的补充：

<div id="second-box" class="hide">Hi All</div>

这是jQuery。在文档加载时，它将等待5秒钟，然后从＃second-box元素中删除hide类。

$(document).ready(function () {
    timer = setTimeout(function () {
        $('#second-box').removeClass('hide');
    }, 5000);
});

小提琴：http://jsfiddle.net/qx7ebyn2/

Answer 2

您可以尝试使用此代码作为参考并进行更改：

$(document).ready(function() {
    $(".first, .second, .third").hide();
    timer = setTimeout(function () {
        $('.first').show();
    }, 1000);
    timer = setTimeout(function () {
        $('.second').show();
    }, 2000);
    timer = setTimeout(function () {
        $('.third').show();
    }, 3000);
  });
</script>

<div class="main ">
    <div class="first">first</div>
    <div class="second"> second </div>
    <div class="third"> third </div>
</div>

有这个DIV类（第一，第二和第三），它逐个显示 setTimeout Interval。

jQuery div隐藏并显示其他div 5秒setTimeout

2 个答案: