InputEvent: Methode getTargetRanges()
Die Methode getTargetRanges()
der InputEvent
-Schnittstelle gibt ein Array von StaticRange
-Objekten zurück, die von einer Änderung des DOM betroffen sein werden, wenn das Eingabeereignis nicht abgebrochen wird.
Dies ermöglicht es Webanwendungen, das Textbearbeitungsverhalten zu überschreiben, bevor der Browser den DOM-Baum ändert, und bietet mehr Kontrolle über Eingabeereignisse, um die Leistung zu verbessern.
Je nach Wert von inputType
und dem aktuellen Bearbeitungshost variiert der erwartete Rückgabewert dieser Methode:
Syntax
getTargetRanges()
Parameter
Keine.
Rückgabewert
Ein Array von StaticRange
-Objekten.
Beispiele
Merkmals-Erkennung
Die folgende Funktion gibt true
zurück, wenn beforeinput
und damit
getTargetRanges
unterstützt wird.
function isBeforeInputEventAvailable() {
return (
window.InputEvent &&
typeof InputEvent.prototype.getTargetRanges === "function"
);
}
Grundlegende Verwendung
Das folgende Beispiel wählt ein contenteditable
-Element aus und nutzt das
beforeinput
-Ereignis, um das Ergebnis von getTargetRanges()
zu protokollieren.
const editableElem = document.querySelector('[contenteditable="true"]');
editableElem.addEventListener("beforeinput", (e) => {
const targetRanges = e.getTargetRanges();
console.log(targetRanges);
});
Spezifikationen
Specification |
---|
Input Events Level 2 # dom-inputevent-gettargetranges |
Browser-Kompatibilität
BCD tables only load in the browser