Wie bekomme ich das fokussierte Element mit jQuery?

Question

Wie kann ich mithilfe von jQuery das Eingabeelement mit dem Fokus des Cursors (Cursor) abrufen?

Oder mit anderen Worten, wie zu bestimmen, ob eine Eingabe den Fokus der Einfügemarke hat?

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; 

Welches sollte man als empfohlen suchen zu müssen? unter Angabe des jQuery docs:

Wie bei anderen pseudo-Klassen-Selektoren (jene, die mit einem beginnen „:“), es vorangehen werden empfohlen: mit einem Tag-Namen oder einem anderen Wähler Fokus; Andernfalls wird der universelle Selektor ("*") impliziert. Mit anderen Worten, die blanke $(':focus') entspricht $('*:focus'). Wenn Sie nach dem aktuell fokussierten Element suchen, ruft $ (document.activeElement) es ab, ohne die gesamte DOM-Struktur durchsuchen zu müssen.

Die Antwort lautet:

document.activeElement 

Und wenn Sie das Element ein jQuery-Objekt Einwickeln wollen:

$(document.activeElement) 

Answer 2

$(document.activeElement) 

Wird es abrufen, ohne den gesamten DOM-Baum auf der Verwendung jQuery documentation

Answer 3

Versuchen Sie folgendes:

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

Answer 4

Ich habe zwei getestet Möglichkeiten in Firefox, Chrome, IE9 und Safari.

(1). $(document.activeElement) funktioniert wie erwartet in Firefox, Chrome und Safari.

(2). $(':focus') funktioniert wie erwartet in Firefox und Safari.

Ich bewegte in die Maus, um 'Name' einzugeben und drückte auf der Tastatur Enter, dann versuchte ich, das fokussierte Element zu erhalten.

(1). $(document.activeElement) gibt die Eingabe zurück: text: Name wie erwartet in Firefox, Chrome und Safari, aber es gibt die Eingabe zurück: submit: addPassword in IE9

(2). $(':focus') kehrt Eingabe: Text: Name wie erwartet in Firefox und Safari, aber nichts in 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 5

Wie wird es niemand erwähnt hat ..

document.activeElement.id 

ich IE8 benutze und habe es nicht getestet auf einem anderen Browser. In meinem Fall verwende ich es, um sicherzustellen, dass ein Feld mindestens 4 Zeichen umfasst und fokussiert ist, bevor es wirkt. Sobald Sie die 4. Nummer eingeben, wird es ausgelöst. Das Feld hat eine ID von "Jahr". Ich benutze ..

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