响应右键按下和弹起事件

最新推荐文章于 2023-06-12 14:14:42 发布
最新推荐文章于 2023-06-12 14:14:42 发布
阅读量1.1k 收藏
点赞数
分类专栏： Javascript 文章标签： xhtml html border 浏览器 ie table
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/seeds_home/article/details/6908408
版权
 

响应右键按下事件(FF测试完美,IE有点问题)

在需要响应右键按下的html元素加上 οnmοusedοwn="if(event.button == 2) alert('我被右键了!')" 即可.

onmousedown是鼠标按下事件,event.button == 2是鼠标右键按下事件

下面是完整例子(文件以UTF-8编码方式保存):

Test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

      

<head>

      

       <title>Test</title>

 

       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 

</head>

 

<body>

      

       <!-- onmousedown是鼠标按下事件,event.button == 2是鼠标右键按下事件 -->

       <table id-"testTable" border="1" οnmοusedοwn="if(event.button == 2) alert('鼠标右键按下!')">

              <tr>

                     <td>第1列</td>

                     <td>第2列</td>

                     <td>第3列</td>

                     <td>第4列</td>

              </tr>

       </table>

      

</body>

 

</html>

 

 

响应右键弹起事件(FF测试完美,IE有点问题)

在需要响应右键弹起的html元素加上 οnmοuseup="if(event.button == 2) alert('鼠标右键弹起!')" 即可.

onmouseup是鼠标弹起事件,event.button == 2是鼠标右键弹起事件

下面是完整例子(文件以UTF-8编码方式保存):

Test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

      

<head>

      

       <title>Test</title>

 

       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 

</head>

 

<body>

       <table id-"testTable" border="1" οnmοusedοwn="if(event.button == 2) alert('鼠标右键按下!')" οnmοuseup="if(event.button == 2) alert('鼠标右键弹起!')">

              <tr>

                     <td>第1列</td>

                     <td>第2列</td>

                     <td>第3列</td>

                     <td>第4列</td>

              </tr>

       </table>

      

</body>

 

</html>

 

 

自定义响应右键弹起事件(FF测试完美,IE有点问题)

我们知道,每个浏览器都对鼠标右键弹起事件οnmοuseup="if(event.button == 2) // 默认实现)"有一个默认的实现,这个默认实现就是弹出一个设备上下文(contextmenu),例如在IE中,截图如下:

我们有这样的需求, 对鼠标右键弹起事件有自己的实现(例如弹出自己的设备上下文),这首先要屏蔽浏览器对鼠标右键弹起事件默认的实现.具体做法如下:

在需要有上述需求的HTML元素上响应oncontextmenu事件(弹出设备上下文),让浏览器的默认设备上下文失效.
οncοntextmenu= {if (document.all) window.event.returnValue = false;

else event.preventDefault();}//让浏览器都对鼠标右键弹起事件的响应失效

 

下面是完整例子(文件以UTF-8编码方式保存):

Test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

                                

<head>

                                

                                 <title>Test</title>

 

                                 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 

</head>

 

<body>

                                

                                 <table id="testTable" border="1" οncοntextmenu="if (window.document.all) {window.event.returnValue = false;} else {event.preventDefault();}"

                                   οnmοuseup="if(event.button == 2) window.alert('鼠标右键弹起!')">

                                   <tr>

                                          <td>第1列</td>

                                          <td>第2列</td>

                                          <td>第3列</td>

                                          <td>第4列</td>

                                   </tr>

                                 </table>

                                

</body>

 

</html>

 

心得

在IE中,event是window对象的属性,而在FF中不是,在IE中我们可以这样子写window.event,还可以直接写成event,而在FF中只能写成event,为了兼容性和避免不必要的麻烦,无论是在IE还是在FF,都写成event.

种子之家
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
利用MFC鼠标消息响应事件实现在picture control控件上图像ROI区域选定与裁剪
04-26
利用vs2010MFC对话框的鼠标消息函数RBBUTTONDOWN,ONMOUSEMOVE,RBBUTONUP实现在picture control控件上选定图像的矩形ROI感兴趣区域，并裁剪显示出所选定的ROI区域。按住鼠标右键，拖动光标划定矩形区域，再弹起鼠标右键即完成一次ROI区域选定。
鼠标右击事件
JohnZhongJob的博客
12-17 5657
鼠标右击事件中一般要禁止掉系统本身的右键菜单，在为元素添加新的菜单； 在添加右击事件中onclick是不生效的，一般用mousedown或者mouseup事件； 鼠标左键为0，中间件为1，右键为2； &lt;script&gt; document.oncontextmenu = function(){return false}; document.getElementByI...
vscode右键点击，松开后自动触发鼠标所在位置的按钮（误触发双击效果）
最新发布
qq_37946291的博客
06-12 670
2、打开easystroke，选择preferences tab。4、点击Timeout profile，选择Timeout OFF。3、点击Gesture Button，在出现的框中右键单击一次。例如如下，右键展开菜单，松手会自动触发。1、安装easystroke。
javascript实现自定义右键菜单（绑定鼠标左右键）
m0_71765265的博客
01-26 2868
js实现自定义右键思路： 1.绑定鼠标右键函数。 2.获取鼠标右键按下位置的x坐标（到左面的距离），y坐标（到上面的距离）。 3.获取滚动条向下滚动距离，获取滚动条向左滚动距离4.最后+‘px’,补全单位，添加到元素style属性，将元素移动到鼠标右键位置。
鼠标左键单击时使用纯js触发右键单击
jojo1001的博客
10-02 1021
鼠标左键单击时使用纯js触发右键单击。
JavaScript 监听鼠标左右同时按下/同时按下移动
白瑕 的博客
04-06 1255
基于原生JavaScript, 在使用three.js的raycaster模拟瞄准及射击时用到.
原生JS监听鼠标右键事件，禁用默认事件，绑定新的自定义标签的方法
陈先生的博客
12-19 3381
最近在开发的时候，需要对鼠标右键做一个监听，根据查阅文档发现我们可以使用oncontextmenu来对右击事件进行监听，如果要监听全局的话，直接使用window.oncontextmenu来进行绑定。首先我们要使用e.preventDefault();禁用的默认的右击事件，然后再添加我们的自定义的内容；
bullet-constraints-builder:Blender的附件，可以通过物理上可行的方式通过约束来连接刚体。 （只需要ZIP文件即可在Blender中安装。单击文件名，然后在下一页“下载”中单击鼠标右键，然后“另存为”将不起作用！）
05-06
该项目通常检查在发生地震或爆炸等灾难性事件时改善第一响应的措施。该项目的特定部分是模拟灾难性事件对建筑结构的影响。 在为期三年的项目中，Laurea研究了离散元素方法DEM在虚拟模拟倒塌建筑结构中的应用。 将把...
VC立体的拧魔方模拟程序源码,附开发文档.rar
07-09
触发事件借助鼠标左、右键的按下和弹起这两个基本的消息来传递，通过鼠标点击的位置不同产生不同转动操作，而左、右键的使用则可以改变转动的方向。我们规定一个正方向，那么，左键对应正向转动，右键对应反向转动...
「《计算机动画》在线作业」.doc
05-23
【弹起】 B. 【按下】 C. 【指针经过】 D. 【点击】 14. 在Ｆlash中,不能直接作为遮罩层对象的是( ）。 F. 图形 A. 按钮 B. 线条 C. 文字 15. 下列图层中哪种类型的图层不可以由普通图层转换得到（ ）。 A. 引导层 ...
北师大网络教育《计算机动画》在线作业Word版.doc
05-23
" "【弹起】 " "【按下】 " "【指针经过】 " "【点击】 " "在Flash中，不能直接作为遮罩层对象的是（ ）。 " "图形 " "按钮 " "线条 " "文字 " "下列图层中哪种类型的图层不可以由普通图层转换得到（ ）。 " "引导...
鼠标右键点击事件
~~
09-07 3220
方式一 <el-button @contextmenu.prevent="clickRight()">保存</el-button> .prevent可以阻止弹出默认的窗口 方式二 <el-button @click.right="clickRight()">保存</el-button> 方式三 通过鼠标的mousedown事件。在鼠标按下的操作中 我们鼠标左键是 0 中间滚轮是 1 右键 是2 document.addEventL.
在浏览器中鼠标右键点击时进行定位和触发点击事件
⊱MinG⊰ の 博
03-30 5392
在浏览器中鼠标右键点击时进行定位和触发点击事件 开发工具与关键技术：Microsoft Visual Studio 2015、…NET MVC 作者：邓恩明 撰写时间：2019年03月27日 一般情况下，当我们用浏览器执行MVC项目时，在某个页面中点击鼠标右键时浏览器都会默认的有一个点击事件，如下： 那么如果我们在项目中需要借助点击鼠标右键来实现某个功能的话，我们就需要在页面的某一块特定的区域内...
Javascript如何判断按下的是鼠标左键还是右键
chentu279203653csdn的博客
01-26 1万+
Javascript如何判断按下的是鼠标左键还是右键 一、需求：在页面上某个元素上点击鼠标右键，弹出二级悬窗（右键菜单）。 二、解决技术问题：如何监听鼠标右键事件 三、解决方案：  1.使用jquery开发库；  2.给该元素注册jquery的mousedown事件；  3.事件对象event的属性值为0时表示是鼠标左键；值为2时表示鼠标右键。左键：event == 0;右键：
pyqt判断鼠标点击事件——左键按下、中键按下、右键按下、左右键同时按下等等
热门推荐
日沉云起的博客
06-03 1万+
我用自定义的myLabel类继承pyqt中的QLabel类，然后在myLabel类中重载了鼠标按下事件函数，在这一函数中实现了判断左右中键按下的代码。from PyQt5 import QtCore, QtGui, QtWidgets, QtMultimedia class myLabel (QtWidgets.QLabel): # 自定义的QLabel类 def __init__...
java鼠标右键点击事件_java swing鼠标双击和右键事件处理
weixin_42526015的博客
02-17 1790
public class MyMouseListener extends MouseAdapter {public void mouseClicked(MouseEvent evt) {if (evt.getClickCount() == 3) {// 处理鼠标三击} else if (evt.getClickCount() == 2) {// 处理鼠标双击}}}处理鼠标右键public mous...
winfrom怎么响应win10触摸屏按下事件
03-23
WinForms 应用程序可以通过处理 Control.MouseDown 事件来响应 Win10 触摸屏按下事件。在事件处理程序中，您可以检查 MouseEventArgs.Button 属性以确定按下的是哪个鼠标按钮，或者使用 MouseEventArgs.Clicks 属性来确定按下的是单击还是双击。您还可以使用 MouseEventArgs.Location 属性来获取鼠标指针在控件内的位置。以下是一个示例代码片段： private void MyControl_MouseDown(object sender, MouseEventArgs e) { if (e.Button == MouseButtons.Left) { // 处理左键按下事件 } else if (e.Button == MouseButtons.Right) { // 处理右键按下事件 } // ... } 请注意，您需要将 MyControl_MouseDown 事件处理程序附加到您想要响应触摸屏按下事件的控件上。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值