jQuery：隐藏的 div 需要重新出现答案

【问题标题】：jQuery: hidden divs need to re-appearjQuery：隐藏的 div 需要重新出现
【发布时间】：2013-05-16 13:20:30
【问题描述】：

我有几个产品在一个 div 中并排排列，我正在使用这个脚本一个一个地隐藏。

在某些时候它们都消失了，我希望它们都重新出现。我尝试了一些 .show，但我可能对展示位置有误。

有人可以看看，看看需要做什么才能让脚本按预期工作吗？

<script>
 $(document).ready (function() {
        "$('.add1').each(function(index) {
            setTimeout(function(el) {
                el.hide('slow');
            }, index * 2000, $(this));
        });
    });
</script>

【问题讨论】：

您希望它们何时重新出现？ $('.add1').show() 会这样做，但如果仍然存在未完成的超时，他们将再次隐藏一些元素。（另请注意，将第三个参数传递给 setTimeout() 并不适用于所有浏览器。）顺便说一句，你认为 echo 真的是为这个问题提供 JS 代码的最佳方式吗？
我试过$('.add1').show()，但它使.add1消失并在它消失后立即出现，将几个.add1 div变成一个大的消失并重新出现的混乱。在所有.add1 div 消失后，我需要它们重新出现。

标签： jquery timeout hide show

【解决方案1】：

你可以试试这样的：

$(document).ready (function() {
    var $add1 = $('.add1').each(function(index, el) {
        setTimeout(function() {
            $(el).hide('slow');
        }, index * 2000);
    });
    setTimeout(function() {
        $add1.show('slow');
    }, $add1.length * 2000);
});

即先将所有超时排队隐藏元素，然后再排队一次超时再次显示。

演示：http://jsfiddle.net/tsuQd/

当然，这会同时显示所有内容。要一次显示一个，您可以执行以下操作：

$(document).ready (function() {
    var $add1 = $('.add1'),
        count = $add1.length;        
    $add1.each(function(index, el) {
        setTimeout(function() {
            $(el).hide('slow');
        }, index * 2000);
        setTimeout(function() {
            $(el).show('slow');
        }, (count + index) * 2000);
    });
});

演示：http://jsfiddle.net/tsuQd/1/

请注意，我已经调整了您在超时回调中获取元素引用的方式，因为在所有浏览器中都不能使用带有 setTimeout() 的第三个参数。

【讨论】：