举例说明js鼠标事件有哪些?

举例说明js鼠标事件有哪些?

JS鼠标事件有很多,以下是一些常见的例子,并根据其功能进行了大致的分类:

鼠标点击事件:

click: 当用户点击鼠标左键时触发。这是最常用的点击事件。

dblclick: 当用户双击鼠标左键时触发。

mousedown: 当用户按下鼠标按钮(左键、右键或中键)时触发。

mouseup: 当用户释放鼠标按钮(左键、右键或中键)时触发。

contextmenu: 当用户点击鼠标右键(或在键盘上按下上下文菜单键)时触发。通常用于显示自定义右键菜单,可以通过preventDefault()方法阻止默认的上下文菜单。

鼠标移动事件:

mousemove: 当鼠标指针在元素上移动时反复触发。需要注意的是,这个事件触发非常频繁,可能会影响性能,因此应谨慎使用。

mouseover: 当鼠标指针从元素外部移入元素内部时触发。

mouseout: 当鼠标指针从元素内部移出元素外部时触发。

mouseenter: 当鼠标指针进入元素时触发。与mouseover的区别在于,mouseenter不会冒泡。

mouseleave: 当鼠标指针离开元素时触发。与mouseout的区别在于,mouseleave不会冒泡。

鼠标滚轮事件:

wheel: 当用户滚动鼠标滚轮时触发。可以获取滚轮滚动的方向和距离。

DOMMouseScroll (已弃用,仅限Firefox): Firefox旧版本使用的滚轮事件,现在应该使用wheel。

其他鼠标事件:

selectstart: 当用户开始选择文本时触发。

selectend: 当用户结束选择文本时触发。

一个简单的click事件例子:

Click Event Example

mousemove事件的例子 (注意性能问题):

Mousemove Event Example

希望这些例子能帮助你理解JS鼠标事件。 记住,根据你的具体需求选择合适的事件类型,并注意潜在的性能问题。

相关推荐

3、梦幻西游气血计算
如何下载365app软件

3、梦幻西游气血计算

📅 11-10 👍 416
有个阿里云服务器能做什么业务
线上365bet投注

有个阿里云服务器能做什么业务

📅 11-19 👍 374