Wie kann ich Texteingabeänderungen in Echtzeit browserübergreifend verfolgen?

As-You-Type-Verfolgung bei Texteingaben

Onchange-Ereignisse für Texteingaben werden normalerweise erst ausgelöst, wenn der Fokus verloren geht. Für Szenarien, in denen Sie Echtzeit-Tracking benötigen, gibt es jedoch mehrere Optionen.

oninput Event

Moderne Browser unterstützen das oninput-Ereignis, das kontinuierlich als Textfeld ausgelöst wird inhaltliche Änderungen. Dadurch entfällt die Notwendigkeit, den Fokus zu verlieren.

onpropertychange

Für Internet Explorer 8 und niedriger können Sie das Ereignis onpropertychange verwenden.

Ereignisbehandlung mit Eingabe und Eigenschaftsänderung

Durch die Kombination von oninput und onpropertychange können Sie sowohl mit modernen als auch mit älteren Browsern problemlos umgehen:

const source = document.getElementById('source');
const result = document.getElementById('result');

const inputHandler = function(e) {
  result.innerText = e.target.value;
};

source.addEventListener('input', inputHandler);
source.addEventListener('propertychange', inputHandler); // for IE8

Überlegungen zu Auswahlfeldern

Firefox, Edge 18- und IE9 lösen keine Onchange-Ereignisse aus wenn Optionen in Auswahlfeldern ausgewählt werden. Erwägen Sie für diese Browser stattdessen die Verwendung eines Änderungsereignis-Listeners.

Das obige ist der detaillierte Inhalt vonWie kann ich Texteingabeänderungen in Echtzeit browserübergreifend verfolgen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!