Jquery कई से वर्ग निकालने के लिए, एक

Question

को वर्ग को जोड़ने के एक आम आपरेशन मैं अपने आप को कर पाते हैं निम्नलिखित है:

<ul> 
    <li>One</li> 
    <li class="current">Two</li> 
    <li>Three</li> 
</ul> 

var $allLi = $('li'); 

$allLi.click(function(){ 
    $allLi.removeClass('current'); 
    $(this).addClass('current'); 
}); 

इस गाढ़ा करने के लिए, किसी भी तरह $ allLi और संयोजन के द्वारा एक रास्ता है $ (this) और टॉगल क्लास का उपयोग कर?

धन्यवाद!

Answer 1

जोनाथन के समाधान ठीक काम करना चाहिए, लेकिन मैं एक अलग समाधान प्रस्तावित करना चाहते हैं।

सभी तत्वों को अनसेट करने और फिर वर्तमान का चयन करने के बजाय, वर्तमान तत्व का ट्रैक न रखें और केवल उस पर ऑपरेशन करें?

<ul> 
    <li>One</li> 
    <li class="current">Two</li> 
    <li>Three</li> 
</ul> 

<script type="text/javascript"> 
    (function() { 
     var current = $("li.current"); 
     $("li").click(function() { 
      current.removeClass("current"); 
      current = $(this); 
      current.addClass("current"); 
     }); 
    }()); 
</script> 

यह "अब" लेकिन यह भी अधिक कुशल है।

मेरा समाधान लक्ष्य रूप से डोम में आंशिक रूप से जावास्क्रिप्ट में सभी राज्य रखना है। toggleClass इस सिद्धांत को रोकता है। यह इतना मायने नहीं रखता है कि "अरे यह कुछ आसान करने का एक बहुत लंबा और सुपर जटिल तरीका दिखता है", इसके पीछे एक विचार है। यदि आपका आवेदन राज्य केवल एक चयनित तत्व से अधिक जटिल हो जाता है तो आप समस्याओं को चलाएंगे यदि आप कोशिश करते हैं और उस स्थिति को डीओएम में डालते हैं। डीओएम सिर्फ 'दृश्य' है, अपने राज्य को 'मॉडल' (जेएस कोड) में रखें।

Answer 2

मैं आप इसे जोड़ सकते हैं, और भाई बहन से हटाने का मानना ​​है:

$("li").on("click", function(){ 
    $(this) 
    .addClass("current") 
    .siblings() 
     .removeClass("current"); 
}); 

डेमो: http://jsbin.com/owivih/edit#javascript,html,live