Angenommen, ich habe zwei HTML-Textfelder auf meiner Webseite:
%Vor% In jedem Textfeld kann der Benutzer bis zu fünf Zeichen eingeben. Wie kann ich Javascript mit oder ohne jQuery verwenden, um den Cursor automatisch von txt1
nach txt2
zu verschieben, wenn der Benutzer fünf Zeichen in txt1
?
Eine grundlegende Implementierung wäre wie folgt:
%Vor%Aber es gibt einige Usability-Feinheiten, die Sie interessieren können oder nicht. Wenn das oben Genannte nicht ausreicht, gibt es viele jQuery-Plugins, die das für Sie erledigen können.
Es heißt autotabbing, und es gibt viele Plugins, die bereits für jquery existieren, die das tun. Einfach googlen.
Wenn Sie wissen möchten, wie es geht, binden Sie ein onkeyup-Ereignis an Eingaben. Jedes Mal, wenn ein Schlüssel freigegeben wird, vergewissere dich, dass es kein funktionaler Schlüssel wie "Tab" ist (Du solltest dem Nutzer erlauben, "Shift + Tab" oder "Tab" an den Eingang zu geben, ohne ihn dann automatisch zum nächsten Feld abzutasten.)
Wenn dann die Länge des Eingabewerts das maxlength-Attribut der Eingabe überschreitet, setzen Sie den Fokus auf die nächste Eingabe (in jQuery, $currentInput.next('input').focus()
.
Keine dieser Lösungen funktioniert in direktem Javascript ... dieses Snippet ist ein Anfang:
%Vor%Aber sobald du die Nummer eingegeben hast, kannst du nicht mehr zurückgehen und sie bearbeiten, denn sobald du delete drückst, springt sie zurück zu txt2.
Das einzige, was geändert werden muss, ist stattdessen onkeyup . : D
jQuery ist für die überwiegende Mehrheit der Dinge, auf denen es verwendet wird, übertrieben und faul programmiert, und dies ist ein großes Beispiel. Es sei denn, Sie verwenden es bereits auf der Seite, es ist eine schreckliche viel Aufwand für so eine kleine Aufgabe.
Die Idee ist, das Ereignis keydown
zu behandeln und zu prüfen, ob die maximale Länge erreicht wurde; Wenn ja, fokussiere das nächste Steuerelement.
Tags und Links javascript jquery textbox