Für eine gute Benutzererfahrung sind die Zugänglichkeit und Verfügbarkeit der Website/Web -App sowie der Funktionalität von entscheidender Bedeutung.
Wenn unsere Website gut läuft/Erfahrung ist gut, sind Benutzer sich dessen nicht bewusst, aber sie werden es auf jeden Fall spüren, wenn es uns nicht gut geht. Ein wichtiger Bestandteil der Verfügbarkeit und Zugänglichkeit der Anwendungen ist die Verarbeitung des Eingabefokus, aber dies ist ein weiterer Punkt, den Entwickler häufig übersehen.
Ein Beispiel für die schlechte Handhabung des Eingangsfokus: Öffnen Sie ein Fenster, nachdem Sie auf einen Link geklickt haben, konzentriert sich jedoch nicht in ein Element im Fenster. Noch schlimmer: Konzentrieren Sie sich auf ein Element im Modalfenster, aber der Fokus kehrt nach dem Schließen nicht zurück. Idealerweise wird eine Referenz gespeichert, wenn die Verbindung ausgelöst wird, und der Cursor konzentriert sich auf ein neues Fenster und bewegt den Cursor zurück, wenn das Fenster schließt.
Aber was ist, wenn Sie nicht wissen, in welchem Element der Eingangscursor jetzt über das Dokument ist. ActiveLeement -Eigenschaft können wir das Element erhalten, das im aktuellen Dokument den Fokus erhält!
Das JavaScript
Es ist einfach zu verwenden document.activeLeement, um das aktuell ausgewählte Element zu finden:
Die Codekopie lautet wie folgt:
var focusedelement = document.activeLeement;
/* Zum Beispiel ein Beispiel:
var triggerelement = document.activeLeement;
myModal = new MyModal ({{
onopen: function () {
this.container.focus ();
},
onclose: function () {
Triggerelement.focus ();
}
});
*/
Diese Eigenschaft ist nicht nur bei regulären Eingabelementen verfügbar, sondern enthält auch Formularfelder oder <a> Tag -Links, sondern jedes Element mit dem Tabindex -Attributsatz ist verfügbar.
Der Grund, warum ich Dokument mag. ActiveLeement ist, dass Sie keine Event -Hör- oder Delegierungen für das Element verwenden müssen, um das Element aufzuspüren und Fokus zu erhalten - Sie können diese Eigenschaft jederzeit erhalten. Bevor Sie solche Funktionen verwenden, sollten Sie natürlich viele Tests durchführen - unabhängig davon, ob es in den Cross -Browser- oder Rassenbedingungen Fehler gibt. Alles in allem bin ich sehr zufrieden damit und finde es sehr zuverlässig!