InputEvent: getTargetRanges() 方法
getTargetRanges()InputEvent 介面的一部分，它返回一個 StaticRange 物件陣列，這些物件將在 DOM 發生更改時受到影響（如果輸入事件未被取消）。
這允許 Web 應用在瀏覽器修改 DOM 樹之前覆蓋文字編輯行為，並提供對輸入事件的更多控制以提高效能。
根據 inputType 的值和當前的編輯主機，該方法的預期返回值會有所不同。
| inputType | 編輯主機 | getTargetRanges() 的響應 |
|---|---|---|
"historyUndo" 或 "historyRedo" |
任意 | 空陣列 |
| 所有剩餘的 | contenteditable |
與事件關聯的 StaticRange 物件陣列 |
| 所有剩餘的 |
input 或 textarea |
空陣列 |
語法
js
getTargetRanges()
引數
無。
返回值
StaticRange 物件陣列。
示例
特性檢測
以下函式在支援 beforeinput（從而支援 getTargetRanges）時返回 true。
js
function isBeforeInputEventAvailable() {
return (
window.InputEvent &&
typeof InputEvent.prototype.getTargetRanges === "function"
);
}
基本用法
以下示例選擇一個 contenteditable 元素，並利用 beforeinput 事件來記錄 getTargetRanges() 的結果。
js
const editableElem = document.querySelector('[contenteditable="true"]');
editableElem.addEventListener("beforeinput", (e) => {
const targetRanges = e.getTargetRanges();
console.log(targetRanges);
});
規範
| 規範 |
|---|
| Input Events Level 2 # dom-inputevent-gettargetranges |
瀏覽器相容性
載入中…