jQuery चयनकर्ता इस बच्चे को नहीं

Question

क्या कोई तत्व चलाने के लिए, कई तत्वों पर क्लिक ईवेंट संलग्न करने का कोई तरीका है, और उसके बाद सभी बच्चों को तत्व के अलावा, एक कार्य चलाने के लिए तत्वों को छोड़कर कोई तत्व है?

एक भयानक व्याख्या दी गई है कि, लेकिन मैं कुछ इस तरह की तलाश में हूँ:

<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) 

आशा यह भी जटिल नहीं है: यहाँ

$(".block_header").click(function(){ 
    $(".block_header span:not(this span)").toggleClass("collapse expand"); 
    $(".container:not(this+div.container)").slideToggle(); 
}); 

नमूना HTML है। यह मुझे बहुत सी कोड बचाएगा।

Answer 1

चयनकर्ता में तत्व को छोड़कर, आप not() फ़ंक्शन का उपयोग कर सकते हैं, जो jQuery सेट से निकालने के लिए DOM तत्व या jQuery ऑब्जेक्ट को स्वीकार करता है।

$(".block_header").click(function(e) { 
    $('.block_header span').not($(this).find('span')).toggleClass("collapse expand"); 

    $('.container').not($(this).next()).slideToggle(); 
}); 

Answer 2

$(".block_header").click(function(){ 
    $(".block_header span").not($('span', this)).toggleClass("active"); 
    $(".container").not($(this).next()).slideToggle(); 
}); 

Answer 3

इस प्रयास करें की तरह

$(".block_header").not(this).find("span").toggleClass("collapse","expand"); 

$(".container").not(this).not("div.container").slideToggle(); 

Answer 4

यह है:

$(this).parent('h3').siblings('h3').children('span').addClass('active'); 
$(this).parent('h3').siblings('h3').next('div.container').slideToggle('active'); 

कि चाल करना चाहिए!

हालांकि, क्या मुझे लगता है कि आप केवल एक सक्रिय होंगे?

$('.active').removeClass('active').parent('h3').next('div.container').slideUp(); 

आशा में मदद करता है :)

संपादित करें:

अतिरिक्त चतुर होने के लिए, एक के रूप में सक्रिय एक स्टोर

अगर ऐसा है, इस सबसे आसान है चर। तो क्लिक पर:

$active = $(this); 

फिर, अगली बार जब आप तत्व फिर से पाने के जाने के लिए jQuery प्राप्त किए बिना ऐसा कर सकते हैं,:

$active.removeClass('active').parent('h3').next('div.container').slideUp(); 
$active = $(this);