JQuery के साथ केंद्रित तत्व कैसे प्राप्त करें?

Question

JQuery का उपयोग करके, मैं उस इनपुट तत्व को कैसे प्राप्त कर सकता हूं जिसमें कैरेट (कर्सर का) फोकस है?

या दूसरे शब्दों में, यह कैसे निर्धारित किया जाए कि किसी इनपुट में कैरेट का फोकस है?

Comments

संभावित डुप्लिकेट stackoverflow.com/questions/967096/...

— बार्ट रों

संभावित डुप्लिकेट: stackoverflow.com/questions/516152/…

— सैम शाइल्स

Answer 1

// Get the focused element:
var $focused = $(':focus');

// No jQuery:
var focused = document.activeElement;

// Does the element have focus:
var hasFocus = $('foo').is(':focus');

// No jQuery:
elem === elem.ownerDocument.activeElement;

आपको किसका उपयोग करना चाहिए? jQuery डॉक्स का हवाला देते हुए :

अन्य छद्म श्रेणी के चयनकर्ताओं के साथ (जो कि ":") से शुरू होता है, इसे पूर्ववर्ती करने की सिफारिश की जाती है: एक टैग नाम या कुछ अन्य चयनकर्ता के साथ ध्यान केंद्रित करें; अन्यथा, सार्वभौमिक चयनकर्ता ("*") निहित है। दूसरे शब्दों में, नंगे $(':focus')के बराबर है $('*:focus')। यदि आप वर्तमान में केंद्रित तत्व की तलाश कर रहे हैं, तो $ (document.activeElement) पूरे DOM ट्री को खोजे बिना इसे पुनः प्राप्त कर लेगा।

उत्तर है:

document.activeElement

और यदि आप चाहते हैं कि एक jQuery वस्तु तत्व को लपेटे:

$(document.activeElement)

Comments

लेकिन रुको, मैं कैसे तेह तत्व है कि परवाह है?

— डेव

@dave। आपका क्या मतलब है "कैरेट है" ? ध्यान केंद्रित? माउस उस पर है

— गदोरन

अच्छी तरह से यहाँ मेरी स्थिति है: जब मैं किसी विशेष तत्व पर क्लिक करता हूँ, तो मैं एक चरित्र को अंतिम केंद्रित इनपुट पाठ तत्व में रखना चाहता हूँ। मूल रूप से वह तत्व जो उस विशेष तत्व को क्लिक करने से पहले अंतिम या सही पर केंद्रित था।

— डेव

@dave। यह नहीं किया जा सकता है। मुझे लगता है कि केवल IE में यह सुविधा है, लेकिन आप अब एक अलग प्रश्न पूछ रहे हैं, आपको इसे एक नए प्रश्न में करना चाहिए।

— गदोरन

मुझे पसंद है कि आपने $ पूर्वप्रचलित चर नाम का उपयोग कैसे किया $focused, जैसा कि मैं मानता हूं कि आप ऐसा करते हैं कि var को निरूपित करना एक jquery वस्तु है। TYVM।

— वलमास

Answer 2

$( document.activeElement )

JQuery प्रलेखन पर सिफारिश के रूप में पूरे डोम के पेड़ को खोजने के लिए बिना इसे पुनः प्राप्त करेंगे

Comments

उस तत्व को कैसे प्राप्त करें जिसमें कैरेट है?

— डेव

Answer 3

मैंने फ़ायरफ़ॉक्स, क्रोम, IE9 और सफारी में दो तरीकों का परीक्षण किया है।

(1)। $(document.activeElement)फ़ायरफ़ॉक्स, क्रोम और सफारी में उम्मीद के मुताबिक काम करता है।

(2)। $(':focus')फ़ायरफ़ॉक्स और सफारी में उम्मीद के मुताबिक काम करता है।

मैं 'नाम' के लिए माउस में चला गया और कीबोर्ड पर एंटर दबाया, फिर मैंने केंद्रित तत्व प्राप्त करने की कोशिश की।

(1)। $(document.activeElement)इनपुट देता है: पाठ: फ़ायरफ़ॉक्स, क्रोम और सफारी में अपेक्षित नाम, लेकिन यह इनपुट देता है: सबमिट करें: IE9 में addPassword

(2)। $(':focus')रिटर्न इनपुट: टेक्स्ट: फ़ायरफ़ॉक्स और सफारी में अपेक्षित नाम, लेकिन IE में कुछ भी नहीं

<form action="">
    <div id="block-1" class="border">
        <h4>block-1</h4>
        <input type="text" value="enter name here" name="name"/>            
        <input type="button" value="Add name" name="addName"/>
    </div>
    <div id="block-2" class="border">
        <h4>block-2</h4>
        <input type="text" value="enter password here" name="password"/>            
        <input type="submit" value="Add password" name="addPassword"/>
    </div>
</form>

Answer 4

इसे इस्तेमाल करे:

$(":focus").each(function() {
    alert("Focused Elem_id = "+ this.id );
});

Comments

हां, इसीलिए इस लूप में केवल एक पुनरावृत्ति होगी। चेतावनी सिर्फ उदाहरण प्रदर्शित करने के लिए है। यदि आपके पास यह चर है, तो आप उस तत्व के साथ सब कुछ कर सकते हैं जो आप चाहते हैं।

— आदिल मलिक

एक से अधिक तत्वों पर ध्यान केंद्रित करना कैसे संभव है?

— एंड्रियास फुरस्टर

@AndreasFurster तुम सही हो। इस लूप में हमेशा केवल एक पुनरावृत्ति होगी। यह लक्ष्य प्राप्त करने का सबसे अच्छा तरीका नहीं हो सकता है, लेकिन यह काम करता है।

— आदिल मलिक

यह जानने के लिए स्वीकृत उत्तर देखें कि ऐसा करने का सबसे खराब / कम से कम कुशल तरीका क्यों है। (अनावश्यक .eachगैर-समझ)

— ब्रैड केंट

Answer 5

यह कैसे है किसी ने उल्लेख किया है ..

document.activeElement.id

मैं IE8 का उपयोग कर रहा हूं, और किसी अन्य ब्राउज़र पर इसका परीक्षण नहीं किया है। मेरे मामले में, मैं यह सुनिश्चित करने के लिए इसका उपयोग कर रहा हूं कि एक क्षेत्र न्यूनतम 4 वर्णों का है और अभिनय से पहले केंद्रित है। एक बार जब आप 4 नंबर दर्ज करते हैं, तो यह चालू हो जाता है। फ़ील्ड में 'वर्ष' की एक आईडी है। मै इस्तेमाल कर रहा हूँ..

if( $('#year').val().length >= 4 && document.activeElement.id == "year" ) {
    // action here
}

Answer 6

$(':focus')[0] आपको वास्तविक तत्व देगा।

$(':focus') आपको तत्वों की एक सरणी देगा, आमतौर पर केवल एक तत्व को एक बार में ध्यान केंद्रित किया जाता है, इसलिए यह केवल तभी बेहतर होता है जब आप किसी तरह से कई तत्वों पर ध्यान केंद्रित करते हैं।

Answer 7

इसे इस्तेमाल करे::

$(document).on("click",function(){
    alert(event.target);
    });

Answer 8

यदि आप पुष्टि करना चाहते हैं कि फ़ोकस किसी तत्व के साथ है या नहीं

if ($('#inputId').is(':focus')) {
    //your code
}