文件：pointerLockElement 屬性
pointerLockElement 是 Document 介面的一個只讀屬性，它提供了在指標被鎖定期間作為滑鼠事件目標的元素。如果鎖定正在掛起、指標未鎖定，或者目標在另一個文件中，則它為 null。
值
一個 Element 或 null。
示例
檢查指標鎖定狀態
此示例包含一個 <div> 元素，該元素又包含一個 <button>。點選該按鈕會請求 <div> 的指標鎖定。
該示例還監聽 pointerlockchange 事件：當此事件觸發時，事件處理程式會停用“鎖定”按鈕（如果文件中的某個元素擁有指標鎖定），否則啟用該按鈕。
效果是：如果您單擊“鎖定”按鈕，指標將被鎖定，按鈕將被停用；如果您隨後退出指標鎖定（例如，透過按 Escape 鍵），按鈕將再次啟用。
HTML
html
<div id="container">
<button id="lock">Lock</button>
</div>
CSS
css
div {
height: 100px;
width: 200px;
border: 2px solid blue;
}
JavaScript
js
const lock = document.querySelector("#lock");
const container = document.querySelector("#container");
lock.addEventListener("click", () => {
container.requestPointerLock();
});
document.addEventListener("pointerlockchange", () => {
const locked = document.pointerLockElement;
lock.disabled = Boolean(locked);
});
結果
規範
| 規範 |
|---|
| 指標鎖定 2.0 # dom-documentorshadowroot-pointerlockelement |
瀏覽器相容性
載入中…