2012-06-25 12 views
7

मैं एक छिपे हुए टेक्स्ट बॉक्स पर फ़ोकस सेट करने का प्रयास कर रहा हूं। मैं चाहता हूं कि जब टेक्स्ट बॉक्स युक्त बॉडी या div फोकस लोड करता है तो फोकस विशेष टेक्स्ट बॉक्स पर होना चाहिए ताकि कुंजी बोर्ड या किसी अन्य डिवाइस से कोई भी इनपुट इस तत्व द्वारा पकड़ा जा सके। मैंने निम्नलिखित कोड को बिना किसी प्रभाव के प्रयास किया है:एक छिपे हुए टेक्स्ट बॉक्स पर ध्यान केंद्रित करने का प्रयास कर रहा है

<body> 
    <input type="text" id="exp" maxlength="16"></input> 
    <input type="text" id="exp2" maxlength="16"></input> 
    <script> 
     $("#exp").hide(); 
     $("#exp").focus(); 
     $("#exp2").keypress(function(){ 
      alert($("#exp").val()); 
     }); 
    </script> 
</body> 

कोई सुझाव दें। jquery समाधान पसंद किया जाएगा।

+1

छिपा तत्व डिजाइन द्वारा ध्यान केंद्रित नहीं कर सकते हैं। आप वास्तव में क्या होने की उम्मीद करते हैं ?? जब भी यह अभी भी दिखाई देता है तो आप फोकस सेट कर सकते हैं और इसे छुपाएं। –

+1

छिपे हुए तत्व का प्रदर्शन किया गया है: कोई भी नहीं; तो वे कैसे केंद्रित हो सकते हैं। बार्बोसा –

+0

मैं कल्पना नहीं कर सकता कि आप ऐसा क्यों करना चाहते हैं। प्लस इनपुट टैग स्वयं बंद टैग हैं।

उत्तर

12

आप hide विधि के माध्यम से छिपा हुआ टेक्स्ट बॉक्स पर फ़ोकस सेट नहीं कर सकते हैं। इसके बजाय, आपको इसे स्क्रीन से बाहर ले जाने की आवश्यकता है। क्रोम 53 में

<body> 
<!-- it's better to close inputs this way for the sake of older browsers --> 
<input type="text" id="exp" maxlength="16" /> 
<input type="text" id="exp2" maxlength="16" /> 
<script> 
// Move the text box off screen 
$("#exp").css({ 
    position: 'absolute', 
    top: '-100px' 
}); 
$("#exp").focus(); 
$("#exp2").keypress(function(){ 
alert($("#exp").val()); 
}); 
</script> 
</body> 
+0

ऐसा करके #exp कभी भी पिछली जगह पर वापस आने में सक्षम नहीं होगा –

+0

आमतौर पर आप एक छुपा पाठ बॉक्स नहीं चाहते हैं जिसका उपयोग वापस देखने के लिए कुंजी को कैप्चर करने के लिए किया जा रहा है। लेकिन आप इसे अपने पिछले स्थान पर वापस ला सकते हैं: '$ ('# exp')। Css ('position', 'static');' –

+0

जो मेरी आवश्यकताओं को पूरा करता है ... हालांकि यह वह नहीं था जिसे मैं ढूंढ रहा था। .. यह बॉक्स समाधान का थोड़ा सा लगता है ....:) ... वैसे भी धन्यवाद ... –

1
visibility:hidden; 
position: absolute; 

काम करता है, और गुप्त तत्व शिफ्ट करने के लिए नाथन दीवार के जवाब के रूप में कोशिश कर रहा से क्लीनर लगता है।

संबंधित मुद्दे