Element: requestPointerLock() 方法

語法

requestPointerLock()
requestPointerLock(options)

引數

options 可選

一個選項物件，其中可以包含以下屬性

unadjustedMovement 可選

停用作業系統級別的滑鼠加速調整，而是訪問原始滑鼠輸入。預設值為 false；將其設定為 true 將停用滑鼠加速。

返回值

一個 Promise，它會解析為 undefined。

安全

呼叫 requestPointerLock() 時需要 瞬時啟用。使用者必須與頁面或 UI 元素進行互動，此功能才能正常工作。此外，目標元素的關聯文件必須處於活動狀態。

如果呼叫 requestPointerLock() 緊接著透過預設的解鎖手勢（而不是透過 exitPointerLock() 呼叫）釋放了指標鎖，則呼叫將失敗，即使存在 瞬時啟用。

如果呼叫 requestPointerLock() 時還呼叫了 requestFullscreen()，則必須先呼叫 requestPointerLock()，因為 requestFullscreen() 會消耗 瞬時啟用 的狀態。

在 <iframe> 元素中呼叫 requestPointerLock() 時，必須新增 allow-pointer-lock 沙箱令牌。此外，其他 <iframe> 元素中的其他元素不得處於指標鎖定模式。

示例

指標鎖定通常用於線上遊戲中，當您希望滑鼠移動專注於控制遊戲，而不受滑鼠指標四處移動、移出遊戲區域或到達視窗邊緣的干擾時。

要啟用指標鎖定，您需要讓使用者以某種方式與 UI 進行互動，例如透過按下按鈕或遊戲畫布本身。

canvas.addEventListener("click", async () => {
  await canvas.requestPointerLock();
});

作業系統預設啟用滑鼠加速，這在您有時需要緩慢精確移動（想想圖形軟體包）但又希望透過更快的滑鼠移動（想想滾動和選擇多個檔案）來移動大距離時很有用。然而，對於一些第一人稱視角遊戲，原始滑鼠輸入資料更適合控制相機旋轉——無論滑鼠移動是快還是慢，相同的距離移動都會導致相同的旋轉。據專業遊戲玩家稱，這可以帶來更好的遊戲體驗和更高的準確性。

要停用作業系統級別的滑鼠加速並訪問原始滑鼠輸入，您可以將 unadjustedMovement 設定為 true

canvas.addEventListener("click", async () => {
  await canvas.requestPointerLock({
    unadjustedMovement: true,
  });
});

有關更多示例程式碼，請參閱

• 指標鎖定演示（檢視原始碼）
• Pointer Lock API
• 停用滑鼠加速以提供更好的 FPS 遊戲體驗

規範

瀏覽器相容性

另見

• Document.pointerLockElement
• Document.exitPointerLock()
• 指標鎖定