使用右键事件
在需要右键的地方加上 onmousedown="if(event.button == 2) alert('点击右键了!');即可
不经意地被一位同事问起在javascript里面如何检测右键事件,并且屏蔽原来的右键菜单,上网查找一翻之后发现一些比较简单的方法。
如设置onmousedown,检查其event.button的值是不是2(代表右键)。
这个方法在FF和IE中都可用,但是在Maxthon中event.button却是0,这让我有点困惑,Maxthon不是IE内核的吗?
我只能设想Maxthon这个壳是做过手脚的。然而如果设置onmouseup,其event.button值就是2了。
所以如果检测右键的话,是设置其onmouseup即可。
document.getElementById("test").onmouseup=function(oEvent) {
if (!oEvent) oEvent=window.event;
if (oEvent.button==2) {
//-- do something for user right click
// alert("Mouse up");
}
}
但是如果还需要屏蔽右键的话,还是用oncontextmenu比较简单,但这时就不是检测右键,而是检测是否弹出上下文菜单。
屏蔽的方法跟屏蔽其他默认行为的方法是一样的,一般来说都是有效的,不过因为某些浏览器有禁止禁止弹出右键菜单的功能,所以如果需要在用户点击右键时做点事情,最好还是不要放在oncontextmenu中,而是放在onmouseup中并检测右键,附加oncontextmenu来屏蔽原来的菜单。
document.getElementById("test").oncontextmenu=function(event) {
//-- do something here
// alert("ContextMenu Popup");
//-- prevent the default behavior
if (document.all) window.event.returnValue = false;// for IE
else event.preventDefault();
};
通过一些简单的测试,可以发现在FF和在IE存在着有趣的区别。
在onmouseup和oncontextmenu事件处理中都使用alert,可以看出来是先执行onmouseup事件再到oncontextmenu的,在IE中,两者会非常连贯的在一起执行,(均认为是发生在test元素上的事件),而在FF里面则不是(前提是test元素所占区域比较小,当alert弹出时需要移动鼠标才能点击'OK'的情况下),它会先执行onmouseup,alert出来之后,移动鼠标点击'OK',这时还是会弹出菜单的,但是如果不移开鼠标,而是直接按Enter确认的话,这时它就会认为是在test元素上触发的事件了。可以理解为是IE
和 Firefox中的事件机制的细节区别。当然我们很少会应用到连续事件的,就无须注意到这点区别了,把需要的事件处理完整的写在一个处理方法里面就是最简单有效的解决方案了。
相关推荐
一个简单的html文件,用于演示鼠标右键事件的响应。使用原生JavaScript编写,可以区分鼠标左键单击,右键单击,滚轮单击事件,在右键时可以弹出一个提供选择的菜单,并且阻止鼠标原生的右键消息,在菜单外任意单击...
该文件是一个实现比较好的鼠标右键菜单。 实现方案为JavaScript。值得学习
采用javascript制作的页面鼠标右键菜单,很实用和好看
而在某些情况下,控制不了网页的鼠标右键双击事件,使得我们的web应用处于失控状态,给浏览者带来不愉快的感受,因此,捕捉并控制鼠标右键的双击事件就很有必要了。 本资料提供的代码,可以捕捉鼠标右键的双击事件...
JavaScript模拟鼠标右键菜单效果_.docx
主要介绍了javascript实现在某个元素上阻止鼠标右键事件的方法和实例,需要的朋友可以参考下
实现鼠标右键菜单,可以自己增加右键功能.
javascript局部自定义鼠标右键菜单 本文实例为大家分享了js局部自定义鼠标右键菜单的具体代码,供大家参考,具体内容如下 前言 html局部自定义鼠标右键菜单 局部! 局部! 局部! 重要的关键词说三遍! 一、...
本文介绍了用户javascript实现禁止点击鼠标右键的方法
javascript container 右键菜单,鼠标右键事件,弹出div层,跟随鼠标右键移动
鼠标右键菜单(JS)
javascript局部自定义鼠标右键菜单.docx
这是我自己写得一个例子,通过js屏蔽复制的.还有右键,网上搜到的,都是屏蔽整个body,我稍作了修改.可以屏蔽文本框.
在网页中自定义点击鼠标右键时的菜单,使网站内容更丰富,提高交互性。内含JavaScript实现和CSS实现。
jQuery鼠标右键点击菜单代码.zip
JS鼠标右键上下文菜单配置插件是一款非常实用的纯JavaScript右键上下文菜单插件。
<tr><td><a href="javascript:clickMenu()" oncontextmenu = showMenu('0')>根目录</a></td> <tr><td><a href="javascript:clickMenu()" oncontextmenu = showMenu('1')>菜单一</a></td> <tr><td><a href="...
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例 [removed] = function(){return false}; //禁止鼠标右键菜单显示 var res = document.getElementById('box'); //找到id为box的div document.body.onmouseup =...
主要为大家详细介绍了JavaScript模拟鼠标右键菜单效果的实现代码,感兴趣的小伙伴们可以参考一下