脚本宝典收集整理的这篇文章主要介绍了JavaScript 鼠标事件(MouseEvent)案例讲解，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

鼠标事件-MouseEvent

当鼠标进行某种操作时，就会生成一个event对象，该对象记录着鼠标触发事件时的所有属性。

可以通过如下方法在GOOGLE控制台打印出 MouseEvent 对象。

function mouseDown(e){
VAR e = e||event;
console.LOG(e)
}
window.onload = function (){ 
document.getelementsbytagname('body')[0].addEventListener('mousedown',mouseDown,false)
}

打印出来的 MouseEvent  如下：

该对象属性很多，但最常用的 不过 offsetX、offsetY、clientX/clientY、pageX、pageY。各个属性对应的是什么呢？ 

下面列出一下常用的事件

altkey ： 触发鼠标事件时是否alt 按键被按下,如果按下，则返回true，否则返回 fasle。

button:  事件属性返回一个阿拉伯数字 ， 0代表 按下 左键 ，1 代表按下 滚轮 ，2 代表按下 右键。

offsetX、offsetY ：事件属性返回触发事件时 鼠标相对于事件源元素 的X,Y坐标，标准事件没有对应的属性。

clientX、clientY ： 事件属性返回当事件被触发时鼠标指针相对于浏览器页面（或客户区）的水平坐标、垂直坐标。

pageX、pageY：事件属性返回当事件被触发时鼠标指针相对于整个页面左上角的水平坐标、垂直坐标。

screenX、screenY：事件属性返回当事件被触发时鼠标位置相对于用户屏幕水水平坐标、垂直坐标，此时的参照点也就是原点是屏幕的左上角。

好吧，文字叙述总归是很烦，上个经典的图，解释一切 ：

到此这篇关于JavaScript 鼠标事件(MouseEvent)案例讲解的文章就介绍到这了,更多相关JavaScript 鼠标事件(MouseEvent)内容请搜索脚本宝典以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本宝典！

脚本宝典总结

以上是脚本宝典为你收集整理的JavaScript 鼠标事件(MouseEvent)案例讲解全部内容，希望文章能够帮你解决JavaScript 鼠标事件(MouseEvent)案例讲解所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。