HTML-Eingabe bei Änderung des Wertes

Question

Ich habe ein Eingabe-Tag. Dieses Tag hat die Autovervollständigungsfunktion nicht ausgeschaltet, so dass man nicht unbedingt eine Taste loslassen muss, um den Wert dieses Feldes zu ändern und ein anderes zu fokussieren. Meine Frage ist: Wie kann ich JEDE Wertänderung dieses speziellen Feldes erkennen, wie z. B.

<input onvaluechange="//do following..." />

Das JavaScript-Attribut onchange wird nicht bei einer Änderung des Wertes ausgelöst, sondern nur bei Änderungen wie Unschärfe, Fokus, etc.

EDIT: Es muss auch nicht unbedingt ein Tastendruck sein. Aufgrund der Autovervollständigung kann der Benutzer einfach mit der Maus auf das Ergebnis der Autovervollständigung klicken, um den Wert zu ändern. Dies würde nicht zu einer onkeydown Veranstaltung.

Answer 1

Es muss auch nicht unbedingt ein Tastendruck sein. Aufgrund der automatischen Vervollständigung

...und viele andere nicht-tastenbasierte Operationen wie Rechtsklick-Ausschneiden/Einfügen, Ziehen und Ablegen, Rückgängigmachen/Wiederherstellen, Anpassung der Rechtschreibprüfung und so weiter.

HTML5 definiert eine oninput Ereignis, um alle direkten Änderungen zu erfassen.

Leider ist die Browserunterstützung heute nicht gegeben (keine Unterstützung im IE, und es gibt einige Bugs in anderen), so dass alles, was Sie tun können, wenn Sie wirklich alle Änderungen an einem Eingabewert früher erkennen müssen als onchange ist zu verwenden setInterval um einen Poller hinzuzufügen, der ständig mit dem vorherigen Wert vergleicht.

Answer 2

Erkennung des "Wertes" eines Textfeldes nach einem Keydown-Ereignis im Textfeld?

Answer 3

Ich hatte ein ähnliches Problem, und die Bindung an ein Dutzend verschiedener Ereignisse reicht einfach nicht aus, da es so viele verschiedene Möglichkeiten gibt, den Eingabewert zu ändern, wie bobince zur Kenntnis genommen.

Also - ich endete schriftlich tot einfach jQuery Überwachung Plugin, das in der Natur generisch ist. Mit ihm können Sie überwachen Eingabewert Änderungen, Textarea Textänderungen, div Inhalt Änderungen, etc:

https://github.com/nixd3v/monitor

Verfolgung von Änderungen des Div-Inhalts:

$.monitor('add', function(){return $("div#someDiv").html()}, function(){
    console.log('Div content changed');
});

Verfolgung von Eingabewertänderungen:

$.monitor('add', function(){return $("#password").val()}, function(){
    console.log('input value changed');
});

Er verwendet natürlich auch eine Schleife, allerdings nicht durch setIntervall sondern durch die Verwendung von setTimeout zusammen mit einer selbstausführenden anonymen Funktion:

(function(){
    // do some stuff
    setTimeout(arguments.callee, 100);
})();

Dadurch wird sichergestellt, dass der nächste Aufruf nicht erfolgt, bevor Ihr Code ausgeführt wurde. Wenn Sie in Ihrem Code Polling verwenden, ist dies der richtige Weg.

Answer 4

Sie können die onKeyPress Attribut, um die vom Benutzer eingegebenen Änderungen zu überwachen.

Zum Beispiel:

<input type='input' onKeyPress='SomeScriptMethod();'>