jQuery 选择器不是这个孩子
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10599094/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery selector not this child
提问by Richard Harris
Is there any way to attach a click event to several elements, and then have all children to the element, except children of THIS (the one clicked), to run a function?
有什么办法可以将一个点击事件附加到几个元素上，然后让所有子元素都加入该元素，除了 THIS 的子元素（被点击的那个）来运行一个函数？
That's a terrible explanation, but I'm looking for something like this:
这是一个糟糕的解释，但我正在寻找这样的东西：
$(".block_header").click(function(){
$(".block_header span:not(this span)").toggleClass("collapse expand");
$(".container:not(this+div.container)").slideToggle();
});
Here's a sample HTML:
这是一个示例 HTML：
<h3 id="sender_header" class="block_header"><span>Sender</span></h3>
<div id="sender_container" class="container">
<p>Show or hide this, based on which H3 is clicked.</p>
</div>
<h3 id="receiver_header" class="block_header"><span>Receiver</span></h3>
<div id="receiver_container" class="container">
<p>Show or hide this, based on which H3 is clicked.</p>
</div>
<h3 id="delivery_header" class="block_header"><span>Delivery</span></h3>
<div id="delivery_container" class="container">
<p>Show or hide this, based on which H3 is clicked.</p>
</div>
<h3 id="items_header" class="block_header"><span>Items</span></h3>
<div id="items_container" class="container">
<p>Show or hide this, based on which H3 is clicked.</p>
</div>
.... etc, etc (many more of the same)
Hope this isn't too complicated. It would save me a LOT of code.
希望这不是太复杂。它会为我节省很多代码。
回答by Matt
Rather than excluding the element in the selector, you can use the not()function, which accepts a DOM element or jQuery object to remove from the jQuery set.
您可以使用该not()函数，而不是排除选择器中的元素，该函数接受要从 jQuery 集中删除的 DOM 元素或 jQuery 对象。
$(".block_header").click(function(e) {
$('.block_header span').not($(this).find('span')).toggleClass("collapse expand");
$('.container').not($(this).next()).slideToggle();
});
回答by will
Try this:
尝试这个：
$(this).parent('h3').siblings('h3').children('span').addClass('active');
$(this).parent('h3').siblings('h3').next('div.container').slideToggle('active');
That should do the trick!
这应该够了吧！
However, can I assume that you will only ever have one active?
但是，我可以假设您只会有一个活跃的吗？
If that is the case, this is the easiest:
如果是这种情况，这是最简单的：
$('.active').removeClass('active').parent('h3').next('div.container').slideUp();
Hope that helps :)
希望有帮助:)
edit:
编辑：
To be extra clever, store the active one as a variable. So on click:
为了更加聪明，将活动的存储为变量。所以点击：
$active = $(this);
Then, next time you can do this, without getting jQuery to go finding the element again:
然后，下次您可以这样做，而无需让 jQuery 再次查找元素：
$active.removeClass('active').parent('h3').next('div.container').slideUp();
$active = $(this);
回答by The System Restart
$(".block_header").click(function(){
$(".block_header span").not($('span', this)).toggleClass("active");
$(".container").not($(this).next()).slideToggle();
});
回答by Imdad
Do it like
做喜欢
$(".block_header").not(this).find("span").toggleClass("collapse","expand");
$(".container").not(this).not("div.container").slideToggle();
