Element:mousedown 事件

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

mousedown 事件在定点设备(如鼠标或触摸板)按钮在元素内按下时,会在该元素上触发。

备注: 其与 click 事件的区别是,click 事件在完整的单击操作完成后触发;也就是说,click 事件在按下并释放鼠标按钮后并且指针仍在同一元素内时触发。mousedown 事件在按下鼠标按钮的那一刻触发。

语法

在类似 addEventListener() 这样的方法中使用事件名称,或者设置事件处理器属性。

js
addEventListener("mousedown", (event) => {});

onmousedown = (event) => {};

事件类型

事件属性

这个接口也继承其父接口 UIEventEvent 的属性。

MouseEvent.altKey 只读

当鼠标事件被触发时,如果 alt 键已被按下,返回 true

MouseEvent.button 只读

触发鼠标事件时,按下按钮的编号(如果适用)。

MouseEvent.buttons 只读

触发鼠标事件时,按下的按钮(如果存在)。

MouseEvent.clientX 只读

鼠标指针相对于局部 DOM 元素的 X 轴坐标。

MouseEvent.clientY 只读

鼠标指针相对于局部 DOM 元素的 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 的别名。

示例

参见 mousemove 事件的示例。

规范

Specification
UI Events
# event-type-mousedown
HTML
# handler-onmousedown

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
mousedown event

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

参见