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

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

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

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

首先，我直接给出源代码：

```
<!DOCTYPE html>
```
```
<html>
```
```
	<head>
```
```
	    <meta charset="utf-8" />
```

	    <title>oncontextmenu 事件禁止鼠标右键点击事件</title>

```
	</head>
```
```
	<body>
```

	   这是一个空白的页面，禁止鼠标右键点击

```
		<script type="text/javascript">
```
```
			function  noneRightClick()
```
```
			{
```
```
			   return false;
```
```
			}
```

			document.oncontextmenu = noneRightClick;

```
		</script> 
```
```
	</body>
```
```
</html>
```

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

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

版权归马富天个人博客所有

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

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

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

顶1

踩0

上一篇《欧氏距离（Euclidean Distance）简单介绍》下一篇《 js实现禁止文本复制、禁止选中文本》

暂无评论

评论审核未开启

回复后邮件通知我