JS 获取鼠标左右键的键值方法

yizhihongxing

JS 获取鼠标左右键的键值方法可以通过事件对象来实现。当鼠标按下时,会触发鼠标按键事件(mousedown);当鼠标弹起时,会触发鼠标松开事件(mouseup)。

通过事件对象的 button 属性,可以获取鼠标按键的键值,0 表示左键,1 表示滚轮中键,2 表示右键。

下面是获取鼠标左键、鼠标右键键值的示例代码:

document.addEventListener('mousedown', function(event) {
  if (event.button === 0) {
    console.log('左键被按下');
  } else if (event.button === 2) {
    console.log('右键被按下');
  }
});

在上面的代码中,我们使用 addEventListener 方法来监听 mousedown 事件,当事件触发时,会执行回调函数并传入事件对象。通过判断事件对象的 button 属性,可以获取鼠标按键的键值。如果 button 的值为 0,说明左键被按下;如果 button 的值为 2,说明右键被按下。

除了使用事件对象的 button 属性外,还可以使用 event.which 属性来获取鼠标按键的键值。对于左键来说,event.which 的值为 1;对于右键来说,event.which 的值为 3。

下面是使用 event.which 属性获取鼠标左键、鼠标右键键值的示例代码:

document.addEventListener('mousedown', function(event) {
  if (event.which === 1) {
    console.log('左键被按下');
  } else if (event.which === 3) {
    console.log('右键被按下');
  }
});

在上面的代码中,我们同样使用 addEventListener 方法来监听 mousedown 事件,当事件触发时,会执行回调函数并传入事件对象。通过判断事件对象的 which 属性,可以获取鼠标按键的键值。如果 which 的值为 1,说明左键被按下;如果 which 的值为 3,说明右键被按下。

总之,我们可以通过上面的两种方式来获取鼠标左键、鼠标右键键值。在实际应用中,可以根据不同需求来选择使用哪一种方式。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JS 获取鼠标左右键的键值方法 - Python技术站

(0)
上一篇 2023年6月27日
下一篇 2023年6月27日

相关文章

  • linuxchown命令用法

    在Linux中,chown命令用于更改文件或目录的所有者和所属组。本攻略将详细讲解Linux中chown命令的用法,包括如何更改文件或目录的所有和所属组、如何递归更改文件或目录的所有者和所属组等。 命令格式 chown命令的基本语法如下: chown [选项]… [所有者][:[所属组]] 文件… 其中,选项包括: -R:递归更改文件或目录的所有者和…

    other 2023年5月8日
    00
  • mybatis笔记

    以下是“MyBatis笔记的完整攻略”的详细说明,包括过程中的两个示例说明。 MyBatis笔记的完整攻略 MyBatis是一款优秀的持久层框架,它可以帮助我们简化数据库操作。在使用MyBatis时,我们可以使用XML或注解来配置SQL语句。以下是一份关于MyBatis笔记的完整攻略。 1. MyBatis基础知识 在开始使用MyBatis之前,我们需要掌握…

    other 2023年5月10日
    00
  • maya怎么使用? maya的几何基础教程

    以下是使用Maya的基础教程,包括Maya的几何基础知识和示例说明: Maya的几何基础教程 步骤1:创建一个几何体 在Maya中,您可以使用多种方式创建几何体,例如: 使用菜单栏:选择“Create” > “Polygon Primitives” > 选择所需的几何体类型(如立方体、球体等)。 使用快捷键:按下Shift + Primitive…

    other 2023年10月15日
    00
  • 鲁班h5 一款前后端均开源的h5快速制作工具

    鲁班H5一款前后端均开源的H5快速制作工具 鲁班H5是一款前后端均开源的H5快速制作工具,它可以帮助我们快速地制作出亮的H5。本攻略将介绍如何使用鲁班H5来制作H5页面。 安装和启动 首先,我们需要装鲁班H5: npm install luban-h5 -g 然后,我们可以使用以下命令来启动鲁班H5: luban-h5 start 在启动后,我们可以在浏览器…

    other 2023年5月7日
    00
  • ChemDraw2020怎么安装破解?ChemDraw2020安装破解使用图文教程

    很抱歉,但我不能提供有关软件破解的指导或支持。这种行为是非法的,违反了软件的使用许可协议。我鼓励您遵守法律和道德准则,购买正版软件并按照它们的官方安装指南进行安装和使用。如果您有任何其他关于化学绘图软件的问题,我将很乐意帮助您。

    other 2023年9月6日
    00
  • Python警察与小偷的实现之一客户端与服务端通信实例

    首先介绍一下”Python警察与小偷”这个项目的背景和概念。 “Python警察与小偷”是一种基于Python编程语言实现的网络安全技术,它通过客户端与服务端的通信方式,让警察在远程主机上对小偷进行操作和控制,从而达到保护计算机安全的目的。 下面我们来介绍一下客户端与服务端通信的实现过程。 选择通信协议 在客户端与服务端之间进行通信时,我们需要选择一种通信协…

    other 2023年6月27日
    00
  • spotbug常见错误心得

    以下是关于“SpotBugs常见错误心得”的完整攻略,包含两个示例。 SpotBugs常见错误心得 SpotBugs是一个静态分析工具,用于检测Java代码中的潜在缺陷。在使用SpotBugs时,我们可能会遇到一些常见的错误。以下是一些常见的错误和如何解决它们的详细攻略。 1. NP_NULL_ON_SOME_PATH_FROM_RETURN_VALUE 这…

    other 2023年5月9日
    00
  • Android读取properties配置文件的实例详解

    Android读取properties配置文件的实例详解 什么是properties配置文件 Properties配置文件是一种简单的键值对存储结构,通常用于存储应用程序的配置信息,其格式如下: key1=value1 key2=value2 key3=value3 其中,”=”前面的是键名,”=”后面的是键值,两者之间使用”=”进行分割,每行代表一个键值对…

    other 2023年6月25日
    00
合作推广
合作推广
分享本页
返回顶部