मैं एक jQuery चयनकर्ता से $ (यह) कैसे बाहर कर सकता हूं?

Question

मेरे पास कुछ इस तरह है:

<div class="content">
    <a href="#">A</a>
</div>
<div class="content">
    <a href="#">B</a>
</div>
<div class="content">
    <a href="#">C</a>
</div>

जब इनमें से एक लिंक पर क्लिक किया जाता है, तो मैं उन लिंक पर .hide () फ़ंक्शन करना चाहता हूं जो क्लिक नहीं किए जाते हैं। मैं समझता हूं कि jQuery के पास: चयनकर्ता नहीं है, लेकिन मैं यह पता नहीं लगा सकता कि इस मामले में इसका उपयोग कैसे किया जाए क्योंकि यह आवश्यक है कि मैं उपयोग कर रहा हूं$(".content a")

मैं कुछ ऐसा करना चाहता हूं

$(".content a").click(function()
{
    $(".content a:not(this)").hide("slow");
});

लेकिन मैं यह नहीं जान सकता कि कैसे उपयोग करें: इस मामले में ठीक से चयनकर्ता नहीं।

Comments

!$(this)सरल कोड के लिए प्रयास करें ।

— अरी

Answer 1

चयनकर्ता के बजाय not() विधि का उपयोग करने का प्रयास करें ।:not()

$(".content a").click(function() {
    $(".content a").not(this).hide("slow");
});

Comments

मुझे यह काम करने के लिए क्यों नहीं मिल सकता है ... $ ("# मेनू-धारक #first_level li")। नहीं (यह) .addClass ("returnToParent");

— marck

@ बिना संदर्भ के, मुझे नहीं पता। एक नया प्रश्न बनाएं और मैं मदद करने में सक्षम हो सकता हूं।

— डैन हर्बर्ट

यह एक बहुत बुरा समाधान (प्रदर्शन-वार) है। कॉलबैक के $(".content a")अंदर कोई वास्तविक कारण नहीं है click... हर क्लिक पर ...

— रोनेन साइनिस

Answer 2

आप चयनकर्ता के notबजाय फ़ंक्शन का उपयोग कर सकते हैं :not:

$(".content a").not(this).hide("slow")

Answer 3

आप jQuery .siblings()विधि का उपयोग भी कर सकते हैं :

एचटीएमएल

<div class="content">
  <a href="#">A</a>
  <a href="#">B</a>
  <a href="#">C</a>
</div>

जावास्क्रिप्ट

$(".content").on('click', 'a', function(e) {
  e.preventDefault();
  $(this).siblings().hide('slow');
});

वर्किंग डेमो: http://jsfiddle.net/wTm5f/

Answer 4

आपको "भाई-बहनों ()" पद्धति का उपयोग करना चाहिए, और उस प्रभाव को लागू करने के लिए ".content" को एक बार और फिर से चुनने से रोकना चाहिए:

एचटीएमएल

<div class="content">
    <a href="#">A</a>
</div>
<div class="content">
    <a href="#">B</a>
</div>
<div class="content">
    <a href="#">C</a>
</div>

सीएसएस

.content {
    background-color:red;
    margin:10px;
}
.content.other {
    background-color:yellow;
}

जावास्क्रिप्ट

$(".content a").click(function() {
  var current = $(this).parent();
  current.removeClass('other')
    .siblings()
    .addClass('other');
});

यहां देखें: http://jsfiddle.net/3bzLV/1/