鼠标事件-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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • zookeeper入门教程_入门教程

    zookeeper入门教程_入门教程zookeeperwatcher架构zookeeper 配置中心分布式ID分布式锁集群搭建数据一致性协议:zab协议Zookeeper Leader选举Observer角色及其配置watcher架构客户端首先将Watcher注册到服务器,同时将Watch对象保存到客户端的Watch管理器中。当Zookeeper服务器监听到的数据发生变化时,服务器会通知客户端,接着客户端的Watch管理器会触发相关的Watcher来回调响应处理逻辑,从而完成整体的数据发布/订阅流程。javaAPIJava

    2022年8月9日
    5
  • 今天发现一个好用的查询IP地址的工具,记录一波「建议收藏」

    今天发现一个好用的查询IP地址的工具,记录一波

    2022年2月15日
    66
  • findwindowex函数用法_内核防止findwindow

    findwindowex函数用法_内核防止findwindow函数功能:该函数获得一个顶层窗口的句柄,该窗口的类名和窗口名与给定的字符串相匹配。这个函数不查找子窗口。在查找时不区分大小写。函数型:HWNDFindWindow(LPCTSTRIpClassName,LPCTSTRIpWindowName);参数:IpClassName:指向一个指定了类名的空结束字符串,或一个标识类名字符串的成员的指针。IpWindowName:指向一个指定了窗口名(窗…

    2022年8月13日
    13
  • docker link使用示例

    docker link使用示例

    2021年8月27日
    65
  • vb教程编程实例详解pdf_vb程序设计教程第五版答案

    vb教程编程实例详解pdf_vb程序设计教程第五版答案实验8-5编写一个能将任意两个文件的内容合并的程序,程序界面由读者由自由设计。解题,在窗体建立一个按钮控件,假定C盘已经有两个要合并的文件text1.dat和text2.dat,代码如下:PrivateSubCommand1_Click()DimcharAsByteOpen”C:\text1.dat”ForBinaryAs#1Open”…

    2022年10月6日
    2
  • 关于函数模板描述错误的是(链接格式错误怎么解决)

    状况1:函数是通用基本函数,故没有放到任何类中,为全局的。声明与实现分别放到.h和.cpp中,编译报:链接错 1:不使用模板函数,用重载 ok2:使用模板函数,但是将定义也一同放到.h中,ok   状况2:在a.h文件中定义的都是模板函数,添加普通函数,编译连接出错,重定义1:将新函数也定义为模板函数2:将新函数定义到其它的.h文件中 3:

    2022年4月15日
    142

发表回复

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

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