2016-08-08 10 views
0

Ich bin auf ein seltsames Problem gestoßen, das ich bereits mit document.activeElement.id gelöst habe, aber bei der Verwendung $('#id').is(':focus') scheint immer false zurückzukehren. die folgende ....is (Fokus) vs .activeElement?

> document.activeElement 
<input type="text" for="zoomSlider" id="zoomText" oninput="zoomSliderUpdate(value)" value="100"> 

> $('#zoomText') 
<input type="text" for="zoomSlider" id="zoomText" oninput="zoomSliderUpdate(value)" value="100"> 

> $('#zoomText').is(':focus') 
false 

> document.activeElement // to check if focus was lost somehow 
<input type="text" for="zoomSlider" id="zoomText" oninput="zoomSliderUpdate(value)" value="100"> 

Warum is(':focus') Rückkehr

In meiner Konsole, ich testete ein falsch?

+1

Sie verließ das # vor Zoomtext aus. Wenn Sie in jquery nach einem Element nach ID suchen, müssen Sie das # vor haben, dh $ ('# zoomText') – Justin

+0

Hier ist ein Beitrag zu diesem Problem, der mit der jQuery-Version in Verbindung steht. Ich weiß nicht, ob es dein Szenario ist, aber es kann ein Hinweis sein. http://stackoverflow.com/questions/16956906/focus-selector-not-work –

+0

Ich benutze jQuery 2.2.x für dieses Knoten-Projekt. –

Antwort

1

Zuerst haben Sie einen Fehler in Ihrem Code. Es sollte $('#zoomText').is(':focus') sein.

Zweitens wird das Element nur im Fokus sein, wenn der Cursor darin ist. Wenn sich der Cursor in der JavaScript-Konsole befindet, hat er den Fokus und bewirkt, dass die Eingabe unscharf ist (unscharf).

Versuchen Sie dies in der JavaScript-Konsole, und setzen Sie den Cursor dann schnell wieder in die Eingabe. Nach 3 Sekunden wird in der Konsole "true" oder "false" angezeigt, um den Fokusstatus des Elements "zoomText" anzuzeigen.

setTimeout(function() { console.log(jQuery('#zoomText').is(':focus')); }, 3000)

+0

Sie haben Recht mit dem Tippfehler, aber es wurde korrekt in meiner Konsole geschrieben. Warum erkennt die Vanille JS den Fokus sogar in der Konsole, während jQuery nicht? 'document.activeElement.id' registriert 'zoomText' weiterhin, während nicht? Suchen sie nach verschiedenen Cues, die sich als "Fokus" oder "Aktiv" registrieren? –

+1

'document.activeElement' und das pseudo-selektierte' ': focus''-Element sind nicht genau dasselbe. Der Browser löst "Fokus" - und "Unschärfe" -Ereignisse aus, wenn der sichtbare Fokus das Element betritt und verlässt, wenn Sie von und zur Konsole, anderen Registerkarten oder anderen Fenstern wechseln. Der Browser behält jedoch den "aktiv fokussierten" Zustand des Dokuments bei und merkt sich, welches Element scharf war, und stellt den sichtbaren Fokus bei Bedarf wieder her. –

+0

Wenn Sie sich die Fokus/Unschärfe-Ereignisse in Aktion ansehen möchten, kopieren Sie dies hier in Ihre Konsole und verwenden Sie das Kommentarfeld als Testobjekt: 'jQuery ('[name =" Kommentar "]'). On ('blur', function() {console.log ('blur');}). on ('focus', function() {console.log ('focus');}) ' Ändern des Fokus wird offensichtlich ausgelöst Ereignisse, aber auch das Wechseln zur Konsole, das Wechseln von Tabs usw. Sie werden sehen, dass es "Fokus" auslöst, wenn Sie zu diesem Tab/Fenster zurückkehren. "Document.activeElement" bleibt jedoch die ganze Zeit gleich. –

Verwandte Themen