如何使用 jQuery 淡出容器中除一个 div 之外的所有 div？

Question

我得到了这个：

$("#id").click(function() {
    $('.swoosh div').fadeOut('fast', function(){
        $('.template').fadeIn('fast');
    });
});

.swoosh 是容器 div，并且 .template 是当我点击 #id 时我想要保留的 div，而 .swoosh 内的所有其他 div 都消失。

我觉得有点傻，但我玩了好几年了，没什么效果。请哪位兄弟帮帮忙。

Answer 1

您可能可以使用 not^[doc]选择器

$("#id").click(function() {
    $('.swoosh div:not(.template)').fadeOut('fast');
});

Answer 2

    $('.swoosh div[class!="template"]').fadeOut('fast');

Answer 3

$("#id").click(function() {
    $('.swoosh div').fadeOut('fast');
    $('.template').fadeIn('fast');
});

Answer 4

由于您要淡出容器 DIV，因此该 DIV 中的所有元素也会淡出似乎是合乎逻辑的。因此，您可以做的是从容器 div 中提取元素并将其放置在 DOM 中的其他位置，然后再淡出容器 DIV。这样，它应该保持可见。

Answer 5

老问题但这也行

$("#id").click(function() {
    $('.swoosh div').not($('.template')).fadeOut('fast');
});