鼠标事件 鼠标事件对象 js

常见的鼠标事件

• onclick 单击鼠标左键

• ondblclick 双击鼠标左键

• 如果给一个元素同时绑定了单击左键和双击左键，每一双左键都会触发两个单击左键事件

• oncontextmenu 单击鼠标右键 默认会触发菜单

• onmousewheel 鼠标滚轮事件 wheel轮子

• 给元素绑定滚轮事件后，在元素上滚动滚轮就会触发该事件，但元素外滚动滚轮不会触发

• onmouseover 鼠标移入

• 有事件传播

• onmouseout 鼠标移出

• 有事件传播

• onmouseenter鼠标移入

• 不会进行事件传播

• onmouseleave鼠标移出

• 不会进行事件传播

• onmouseenter和onmouseleave 事件不会进行事件传播，也就是移入移出子元素的时候，不会向祖先元素进行传播

• onmousemove 鼠标移动

• onfocus 获取鼠标焦点 光标 (一般用于input标签中)

• onblur 失去焦点

• onmousedown 鼠标按下

• 鼠标按下，不单是指左键按下，右键，滚轮，只要是按下鼠标上任意一个都会触发

• onmouseup 鼠标弹起

• 一个click事件会触发一个down一个up，down和up在click

• onselectstart 开始选择

• 当想选中页面或者元素内的文字的时候触发

鼠标事件对象

• 当想要知道按下的是哪一个键的时候，给元素绑定mousedown事件，
• 可以通过mousedown鼠标事件对象里的button属性，来知道具体是按下了哪一个键
• 0 表示左键
• 1 表示滚轮
• 2 表示右键

例

        div.onmousedown=function(e){
            console.log('按下鼠标上的任意一个键')
            e=e||window.event;
            console.log(e.button)
        }