जावास्क्रिप्ट में टेक्स्ट फ़ील्ड्स का फोकस

मान लीजिए कि हमारे पास एक इनपुट है। आप इस इनपुट पर क्लिक कर सकते हैं और उसके बाद उसमें कर्सर ब्लिंक करने लगेगा और आप उसमें टेक्स्ट टाइप कर सकेंगे।

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

इनपुट द्वारा फोकस प्राप्त करने या खोने के क्षण को पकड़ने के लिए, जावास्क्रिप्ट में विशेष इवेंट्स प्रदान किए गए हैं: इवेंट focus इनपुट द्वारा फोकस प्राप्त करने को पकड़ने की अनुमति देता है, और इवेंट blur - फोकस खोने को। आइए व्यवहार में कोशिश करते हैं। मान लीजिए कि हमारे पास एक इनपुट है:

html<input id="elem" value="text">

इसका रेफरेंस एक वेरिएबल में प्राप्त करते हैं:

javascriptlet elem = document.querySelector('#elem');

और अब ऐसा करते हैं कि फोकस प्राप्त करने पर कंसोल में इनपुट का करंट टेक्स्ट प्रिंट हो जाए:

javascriptelem.addEventListener('focus', function() {
  console.log(elem.value);
});