鼠标事件-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  如下:

鼠标事件-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:事件属性返回当事件被触发时鼠标位置相对于用户屏幕水水平坐标、垂直坐标,此时的参照点也就是原点是屏幕的左上角。

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

鼠标事件-MouseEvent

 

(完)

 

 

 

转载于:https://www.cnblogs.com/hanguozhi/p/7382719.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/108229.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • php探针文件内容

    php探针文件内容

    2022年2月15日
    41
  • hive的基本数据类型有几种_hive浮点型数据类型

    hive的基本数据类型有几种_hive浮点型数据类型hive的基本数据类型1.基本数据类型hive类型      说明      java类型    实例  1).tinyint    1byte有符号的整数  byte      20  2).smalint   2byte有符号的整数 short     20  3).int     4byte有符号的整数  int      …

    2022年9月16日
    2
  • 图像去噪序列——BM3D图像去噪模型实现

    图像去噪序列——BM3D图像去噪模型实现1.BM3D模型简介BM3D模型是一个两阶段图像去噪方法,主要包含两个步骤:(1)在噪声图像上,利用局部区域搜索相似块,并进行堆叠,在变换域(DCT域、FFT域)利用硬阈值去噪方法对堆叠的图像块进行去噪,获得堆叠相似块的估计值,最后,根据均值权重进行聚合;(2)通过步骤(1)获取初步估计的图像,在初步估计的图像上进行相似块的聚合;然后,利用维纳协同滤波进行图像去噪,从而,获取最后的去…

    2022年6月4日
    29
  • win10网页出现stack overflow at line 0的解决方法[通俗易懂]

    win10网页出现stack overflow at line 0的解决方法[通俗易懂]有时候浏览网页的时候会出现stackoverflowatline0的错误提示,弹出如下的对对话框。而且电脑变得很卡很慢,这是因为某些脚本在调试过程中可能会造成死循环或消耗大量内存,一旦可使用的内存被消耗光,就会造成内存溢出,既堆栈溢出。 出现stackoverflowatline0(堆栈的益出)的解决办法。首先在IE浏览器的【工具】【Internet选项】的【高级】…

    2022年7月15日
    19
  • 恢复服务器安装信息被破坏了,服务器存储瘫痪数据恢复成功案例-服务器数据恢复…

    恢复服务器安装信息被破坏了,服务器存储瘫痪数据恢复成功案例-服务器数据恢复…一、服务器数据恢复故障描述机房突然断电导致整个存储瘫痪,加电后存储依然无法使用。经过用户方工程师诊断后认为是断电导致存储阵列损坏。整个存储是由12块日立硬盘(3TSAS硬盘)组成的RAID-6磁盘阵列,被分成一个卷,分配给几台Vmware的ESXI主机做共享存储。整个卷中存放了大量的Windows虚拟机,虚拟机基本都是模板创建的,因此系统盘都统一为160G。数据盘大小不确定,并且数据盘都是精简模…

    2022年6月20日
    117
  • 构建嵌入式 Linux 系统的4种有效工具

    构建嵌入式 Linux 系统的4种有效工具

    2021年6月8日
    109

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号