MouseEvent

建構函式

MouseEvent()

建立一個 MouseEvent 物件。

靜態屬性

MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN 非標準 只讀

正常單擊所需的最小力度。

MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN 非標準 只讀

強制單擊所需的最小力度。

例項屬性

此介面還繼承其父級 UIEvent 和 Event 的屬性。

MouseEvent.altKey 只讀

如果滑鼠事件觸發時 alt 鍵處於按下狀態，則返回 true。

MouseEvent.button 只讀

滑鼠事件觸發時按下的或釋放的按鈕編號（如果適用）。

MouseEvent.buttons 只讀

滑鼠事件觸發時按下的按鈕（如果有）。

MouseEvent.clientX 只讀

滑鼠指標在視口座標中的 X 座標。

MouseEvent.clientY 只讀

滑鼠指標在視口座標中的 Y 座標。

MouseEvent.ctrlKey 只讀

如果滑鼠事件觸發時 control 鍵處於按下狀態，則返回 true。

MouseEvent.layerX 非標準 只讀

返回事件相對於當前圖層的水平座標。

MouseEvent.layerY 非標準 只讀

返回事件相對於當前圖層的垂直座標。

MouseEvent.metaKey 只讀

如果滑鼠事件觸發時 meta 鍵處於按下狀態，則返回 true。

MouseEvent.movementX 只讀

滑鼠指標相對於上次 mousemove 事件位置的 X 座標。

MouseEvent.movementY 只讀

滑鼠指標相對於上次 mousemove 事件位置的 Y 座標。

MouseEvent.offsetX 只讀

滑鼠指標相對於目標節點內邊距邊緣位置的 X 座標。

MouseEvent.offsetY 只讀

滑鼠指標相對於目標節點內邊距邊緣位置的 Y 座標。

MouseEvent.pageX 只讀

滑鼠指標相對於整個文件的 X 座標。

MouseEvent.pageY 只讀

滑鼠指標相對於整個文件的 Y 座標。

MouseEvent.relatedTarget 只讀

事件的次要目標（如果存在）。

MouseEvent.screenX 只讀

滑鼠指標在螢幕座標中的 X 座標。

MouseEvent.screenY 只讀

滑鼠指標在螢幕座標中的 Y 座標。

MouseEvent.shiftKey 只讀

如果滑鼠事件觸發時 shift 鍵處於按下狀態，則返回 true。

MouseEvent.mozInputSource 非標準 只讀

生成事件的裝置型別（MOZ_SOURCE_* 常量之一）。這可以讓你例如判斷滑鼠事件是由實際的滑鼠還是由觸控事件生成的（這可能會影響你解釋與事件關聯的座標的準確程度）。

MouseEvent.webkitForce 非標準 只讀

點選時施加的壓力大小。

MouseEvent.x 只讀

MouseEvent.clientX 的別名。

MouseEvent.y 只讀

MouseEvent.clientY 的別名。

例項方法

此介面還繼承了其父級 UIEvent 和 Event 的方法。

MouseEvent.getModifierState()

返回指定修飾鍵的當前狀態。有關詳細資訊，請參閱 KeyboardEvent.getModifierState()。

MouseEvent.initMouseEvent() 已棄用

初始化已建立的 MouseEvent 的值。如果事件已分派，則此方法不執行任何操作。

示例

此示例演示瞭如何使用 DOM 方法模擬複選框的單擊（以程式設計方式生成單擊事件）。然後使用 EventTarget.dispatchEvent() 方法的返回值來確定事件狀態（是否已取消）。

HTML

<p>
  <label><input type="checkbox" id="checkbox" /> Checked</label>
</p>
<p>
  <button id="button">Click me to send a MouseEvent to the checkbox</button>
</p>

JavaScript

function simulateClick() {
  // Get the element to send a click event
  const cb = document.getElementById("checkbox");

  // Create a synthetic click MouseEvent
  let evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window,
  });

  // Send the event to the checkbox element
  cb.dispatchEvent(evt);
}
document.getElementById("button").addEventListener("click", simulateClick);

結果

規範

瀏覽器相容性

另見

• 它的直接父級 UIEvent
• PointerEvent：用於高階指標事件，包括多點觸控。