jQuery के साथ फोकस() इनपुट तत्व, लेकिन कर्सर

Question

दिखाई नहीं देता है जब मैं एक div क्लिक किया जाता है तो मैं एक इनपुट तत्व पर ध्यान केंद्रित करना चाहता हूं।

मेरे एचटीएमएल इस तरह दिखता है:

<div class="placeholder_input"> 
    <input type="text" id="username" maxlength="100" /> 
    <div class="placeholder_container"> 
     <div class="placeholder">username</div> 
    </div> 
</div> 

और मेरी स्क्रिप्ट है:

$("#username").focus(function() { 
    $(this).next().hide(); 
}); 

$(".placeholder_input").mousedown(function() {    
    $(this).children(":first").focus(); 
}); 

जब मैं टेक्स्ट बॉक्स में क्लिक करें, प्लेसहोल्डर पाठ सही ढंग से गायब हो जाता है, लेकिन निमिष कर्सर प्रदर्शित नहीं करता है टेक्स्टबॉक्स में। (और मैं टेक्स्ट बॉक्स में किसी भी पाठ टाइप कर सकते हैं नहीं)

mousedown ईवेंट हैंडलर के अंदर, $(this).children(":first") अभिव्यक्ति सही इनपुट तत्व का चयन करता है, तो मुझे पता नहीं क्यों focus() कॉल काम नहीं करता है।

Answer 1

यह mousedown विधि के साथ काम नहीं करता है; यह, हालांकि, mouseup() और click() तरीकों के साथ काम करता है:

$(".placeholder_input").mouseup(function() {    
    $(this).children(":first").focus(); 
});​ 

JS Fiddle demo।

और:

$(".placeholder_input").click(function() {    
    $(this).children(":first").focus(); 
});​ 

JS Fiddle demo।

संदर्भ:

• click()।
• mouseup()।

Answer 2

mousdown काम नहीं करेगा, click का उपयोग करें।

$(".placeholder_input").click(function() {    
    $(this).children(":first").focus(); 
});​ 

Answer 3

अगर आप जोर देते हैं mousedown का उपयोग करने पर, अगले टिक

$(".placeholder_input").mousedown(function() {    
     var $el = $(this).children(":first"); 
     setTimeout(function() { 
      $el.focus(); 
     }, 0); 
}); 

http://jsfiddle.net/wpnNY/46/