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：用于高级指针事件，包括多点触控。