क्लिक पर खुले और बंद सबमेनस Jquery

Question

मेरे पास एक मुख्य मेनू है जो jquery में क्लिक ईवेंट के साथ सबमेनस प्रदर्शित करेगा (क्लाइंट इसके बजाय होवर क्लिक करना चाहता था) इसलिए मुझे यह काम मिल गया, हालांकि मैं अभी भी एक चीज़ नहीं समझ सकता : मेरे पास मेनू और सबमेनस ठीक तरह से काम कर रहा है, इसलिए जब मैं "समाचार" पर क्लिक करता हूं तो उपमेनू अच्छी तरह से नीचे स्लाइड करता है और जब मैं "समाचार" पर वापस क्लिक करता हूं तो यह वापस बंद हो जाता है, हालांकि अगर समाचार 'सबमेनू खोलने के बाद और मैं "संसाधन" पर क्लिक करता हूं संबंधित सबमेनू प्रकट होता है लेकिन समाचार 'सबमेनू खुला रहता है, मैं चाहता हूं कि पिछले उपमेनू किसी अन्य मेनू आइटम पर क्लिक करें या मुख्य मेनू क्षेत्र के बाहर किसी भी विचार पर क्लिक करें? यहाँ मैं क्या मिला है:

<ul id="MainMenu"> 
     <li><a href="#">Home</a></li> 
     <li><a href="#">About Us</a></li> 
     <li> 
       <a href="#">News</a> 
       <ul class="noJS"> 
       <li><a href="#">sub menu 1</a></li> 
       <li><a href="#">sub menu 2</a></li> 
       <li><a href="#">sub menu 3</a></li> 
       <li><a href="#">sub menu 4</a></li> 
       <li><a href="#">sub menu 5</a></li> 
       <li><a href="#">sub menu 6</a></li> 
      </ul>       
     </li> 
     <li><a href="#">Jobs</a></li> 
     <li><a href="#">Contact Us</a></li> 
     <li><a href="#">Admin</a></li> 
     <li> 
      <a href="#">Resources</a> 
      <ul class="noJS"> 
       <li><a href="#">sub menu 1</a></li> 
       <li><a href="#">sub menu 2</a></li> 
       <li><a href="#">sub menu 3</a></li> 
       <li><a href="#">sub menu 4</a></li> 
       <li><a href="#">sub menu 5</a></li> 
       <li><a href="#">sub menu 6</a></li> 
      </ul> 
     </li> 
     <li class="lastChild"><a href="#">New Button</a></li> 
    </ul> 

और jQuery:

$(function(){ 
$('#MainMenu').find('> li').click(function(){ 
    $(this).find('ul') 
    .stop(true, true).slideToggle(400); 
    return false;  
});  
}); 

Answer 1

इस

$(function() { 
    $('#MainMenu > li').click(function(e) { // limit click to children of mainmenue 
     var $el = $('ul',this); // element to toggle 
     $('#MainMenu > li > ul').not($el).slideUp(); // slide up other elements 
     $el.stop(true, true).slideToggle(400); // toggle element 
     return false; 
    }); 
    $('#MainMenu > li > ul > li').click(function(e) { 
     e.stopPropagation(); // stop events from bubbling from sub menu clicks 
    }); 
});​ 

http://jsfiddle.net/Ssu32/

Answer 2

की तरह कुछ प्रयास करें बस अपने कोड में इस लाइन जोड़े

$('#MainMenu > li').not(this).find('ul').slideUp(); 

पूर्ण कोड

$('#MainMenu').find('> li').click(function() { 
    $('#MainMenu > li').not(this).find('ul').slideUp(); 
    $(this).find('ul').stop(true, true).slideToggle(400); 
    return false; 
});​ 

Check Fiddle