बूटस्ट्रैप ड्रॉपडाउन इनपुट पर गायब हो जाता है

Question

मेरे पास बूटस्ट्रैप ड्रॉपडाउन मेनू है जो मैं लॉगिन करने के लिए उपयोग करने की योजना बना रहा हूं। यह ठीक प्रतीत होता है लेकिन जब मैं उपयोगकर्ता नाम nput का चयन करता हूं तो यह गायब हो जाता है क्योंकि फोकस इनपुट में चला गया है। मैं इनपुट के लिए समर्थन जोड़ने के बारे में कैसे जाउंगा या इसके लिए एक कार्य विधि है?

मेरे वर्तमान कोड है:

<li id="fat-menu" class="dropdown"> 
     <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown" data-target="#">Login <b class="caret"></b></a> 
     <ul class="dropdown-menu" role="menu" aria-labelledby="drop3"> 
      <li role="presentation"><input name="username" type="text" placeholder="Username" /></li> 
      <li role="presentation"><input name="password" type="password" placeholder="Password" /></li> 
      <li role="presentation" class="divider"></li> 
      <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Login</a></li> 
      </ul> 
    </li> 

मेरे jsfiddle पर प्रयास। http://jsfiddle.net/KF8dv/

Answer 1

कृपया इस देखें:: मैं सब पर काम करने के लिए लटकती मिल सके - http://jsfiddle.net/b8769/

आप जब इनपुट पाठ बॉक्स पर क्लिक किया लटकती घटना को रोकने के लिए की जरूरत है। आप जावास्क्रिप्ट का उपयोग करके इसे प्राप्त कर सकते हैं। stopPropagation

$('.dropdown-menu input').click(function(e) { 
     e.stopPropagation(); //This will prevent the event from bubbling up and close the dropdown when you type/click on text boxes. 
    });