jquery - jQuery：隐藏的 div 需要重新出现

Question

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

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

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

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

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

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