oncontextmenu 事件禁止鼠标右键点击事件【隐藏上下文菜单】

学习笔记 马富天 2016-08-16 15:50:41 79 0

【摘要】之前看到别人的博客,想看看他的网页代码,结果发现右键不能点击,即点击右键的时候没有任何反应,不能查看源代码,我以为是非常难以实现的效果,结果,在js代码中就一个oncontextmenu属性设置为false就可以了。

本文主要介绍一下oncontextmenu事件,如何实现网页禁止鼠标右击点击事件。

首先,我直接给出源代码:

  1. <!DOCTYPE html>
  2. <html>
  3. 	<head>
  4. 	    <meta charset="utf-8" />
  5. 	    <title>oncontextmenu 事件禁止鼠标右键点击事件</title> 
  6. 	</head>
  7. 	<body>
  8. 	   这是一个空白的页面,禁止鼠标右键点击
  9. 		<script type="text/javascript">
  10. 			function  noneRightClick()
  11. 			{
  12. 			   return false;
  13. 			}
  14. 			document.oncontextmenu = noneRightClick;
  15. 		</script> 
  16. 	</body>
  17. </html>

注:当用户在整个网页中右击鼠标的时候执行 JavaScript 的 oncontextmenu事件,oncontextmenu事件是指用户右击鼠标时触发并打开上下文菜单。(上下文菜单就是我们通常在网页中点击右键能够出现的信息),本事件返回一个false则代表不显示上下文菜单,即oncontextmenu事件绑定一个noneRightClick()方法,然后里面是false即可。

兼容性,目前为止,所有的浏览器都是支持 oncontextmenu 事件的。(这绝对是一条好消息)

版权归 马富天PHP博客 所有

本文标题:《oncontextmenu 事件禁止鼠标右键点击事件【隐藏上下文菜单】》

本文链接地址:http://www.mafutian.net/185.html

转载请务必注明出处,小生将不胜感激,谢谢! 喜欢本文或觉得本文对您有帮助,请分享给您的朋友 ^_^

1

0

上一篇《 欧氏距离(Euclidean Distance)简单介绍 》 下一篇《 js实现禁止文本复制、禁止选中文本 》
分享到:

暂无评论

评论审核未开启
表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情 表情
验证码

TOP10

  • 浏览最多
  • 评论最多