js oncontextmenu事件使用详解


Posted in Javascript onMarch 25, 2017

定义和使用

oncontextmenu 事件在元素中用户右击鼠标时触发并打开上下文菜单。
注意:所有浏览器都支持 oncontextmenu 事件, contextmenu 元素只有 Firefox 浏览器支持。

实例

当用户在 <div> 元素 上右击鼠标时执行 JavaScript :

<div oncontextmenu="myFunction()" contextmenu="mymenu">

用oncontextmenu事件单禁用右键菜单

onconTextmenu=window.event.returnValue=false;右键菜单禁用,用这个可以禁止复制。

在<body>中加入属性代码:

<script>
 window.document.oncontextmenu = function(){ 
//alert('请不要点击鼠标右键!');
return false;
} 
</script>

oncontextmenu="return false"

onselectstart="return false" 禁止选中网页上的内容

oncopy="return false" 防复制用户在网页上选中的内容

防止用户另存网页:

利用<noscript><iframe src=*.html></iframe></noscript>标签,能防止网页的直接另存,但不能防止网页被人使用工具下载

*为通配符。

例1:

<html>
<head>
<title>OnContextMenu事件</title>
<script language="JavaScript">
<!--
function uFunction()
{   
document.all.infoDiv.innerHTML='你按下了鼠标右键,但是右键菜单不能 显示!';
}
function uFunction2()
{  

document.all.infoDiv.innerHTML='你按下了Ctrl+鼠标右键,可以 显示右键菜单。';
}
//-->
</script>
</head>
<body oncontextmenu="if(!event.ctrlKey){uFunction();return false}else{uFunction2()}">

<div id="infoDiv">你按下了鼠标右键,但是右键菜单不能 显示!<br>你按下了Ctrl+鼠标右键,可以显示右键菜单。

</div>
</body>
</html>

例2:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
  <title>利用OnMousedown和OnContextmenu为表格添加鼠标左中右键单击的处理</title>
  <script type="text/javascript">

var keyArray = new Array(
  

new Array(0, "右键"),
  

new Array(1, "左键"),
  

new Array(2, "右键"), // 测试在IE7中按右键是2,在Maxthon2.0正式版中是0
  

new Array(3, "左键右键同时按"),//在IE7中我测试捕获不到,慎用
  

new Array(4, "中键")
  

//测试同时按两个键更多的表示
  

//new Array(6, "中键右键同时按")


);


function Click()


{
  

var message = GetKeyMessage(event.button);
  

alert(message);
  

if (event.button == 2 || event.button == 0) //按右键,// 测试在IE7中按右键是2,在Maxthon2.0正式版中是0
  

 {
    

//处理代码
  

}


}


function GetKeyMessage(button)


{
  

for (var i = 0; i < keyArray.length; i++)
  

{
    

if (keyArray[i][0] == button)
    

{
      

return keyArray[i][1] + ", event.button = " + button;
    

}
  

}
  

 return "未知组合键, event.button = " + button;


}

</script>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="1">
<tr>

<!--oncontextmenu="return false"屏蔽快捷菜单-->
  <td oncontextmenu="return false" onmousedown="Click()">请分别用左键、右键、中键、左键右键组合点这里测试</td>
</tr>
<tr>
  <td>这个表格没有处理,点这里没反应</td>
</tr>
</table>
</body>
</html>
Javascript 相关文章推荐
jquery 关键字“拖曳搜索”之“拖曳”以及 图片“提示自适应放大”效果 的实现
Apr 18 Javascript
表头固定(利用jquery实现原理介绍)
Nov 08 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
Apr 02 Javascript
javascript html5 canvas实现可拖动省份的中国地图
Mar 11 Javascript
jQuery使用getJSON方法获取json数据完整示例
Sep 13 Javascript
JS实现点击网页判断是否安装app并打开否则跳转app store
Nov 18 Javascript
javascript实现无法关闭的弹框
Nov 27 Javascript
Js中将Long转换成日期格式的实现方法
Jun 05 Javascript
JS左右无缝轮播功能完整实例
May 16 Javascript
JavaScript setTimeout()基本用法有哪些
Nov 04 Javascript
JS实现可以用键盘方向键控制的动画
Dec 11 Javascript
如何用threejs实现实时多边形折射
May 07 Javascript
js 函数式编程学习笔记
Mar 25 #Javascript
CodeMirror js代码加亮使用总结
Mar 25 #Javascript
js 去掉字符串前后空格实现代码集合
Mar 25 #Javascript
在js中做数字字符串补0(js补零)
Mar 25 #Javascript
JavaScript 字符串数字左补位,右补位,取固定长度,截位扩展函数代码
Mar 25 #Javascript
JS去掉字符串前后空格或去掉所有空格的用法
Mar 25 #Javascript
javascript作用域链与执行环境详解
Mar 25 #Javascript
You might like
thinkphp自定义权限管理之名称判断方法
2017/04/01 PHP
PHP中一个有趣的preg_replace函数详解
2018/08/15 PHP
tp5(thinkPHP5)框架数据库Db增删改查常见操作总结
2019/01/10 PHP
XmlUtils JS操作XML工具类
2009/10/01 Javascript
JS关键字球状旋转效果的实例代码
2013/11/29 Javascript
js 剪切板应用clipboardData详细解析
2013/12/17 Javascript
js 去除字符串第一位逗号的方法
2014/06/07 Javascript
js实现iframe自动自适应高度的方法
2015/02/17 Javascript
jQuery禁用键盘后退屏蔽F5刷新及禁用右键单击
2016/01/22 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
2016/12/20 Javascript
Bootstrap 轮播(Carousel)插件
2016/12/26 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
2017/01/19 Javascript
JS实现touch 点击滑动轮播实例代码
2017/01/19 Javascript
微信小程序 弹幕功能简单实例
2017/02/14 Javascript
javascript图片预览和上传(兼容IE)
2017/03/15 Javascript
解决使用vue.js路由后失效的问题
2018/03/17 Javascript
JavaScript进阶(三)闭包原理与用法详解
2020/05/09 Javascript
Python中关于使用模块的基础知识
2015/05/24 Python
使用Python实现BT种子和磁力链接的相互转换
2015/11/09 Python
Python爬取三国演义的实现方法
2016/09/12 Python
python实现决策树C4.5算法详解(在ID3基础上改进)
2017/05/31 Python
python实现键盘控制鼠标移动
2020/11/27 Python
Python利用heapq实现一个优先级队列的方法
2019/02/03 Python
详解python中递归函数
2019/04/16 Python
django框架模板语言使用方法详解
2019/07/18 Python
Python插件机制实现详解
2020/05/04 Python
巴西女装购物网站:Eclectic
2018/04/24 全球购物
台湾专柜女包:KINAZ
2019/12/26 全球购物
土木工程专业自荐信
2013/10/04 职场文书
捐款倡议书范文
2014/02/02 职场文书
环保口号大全
2014/06/12 职场文书
五一劳动节活动总结
2015/02/09 职场文书
幼儿园父亲节活动总结
2015/02/12 职场文书
小学远程教育工作总结
2015/08/13 职场文书
Go 语言下基于Redis分布式锁的实现方式
2021/06/28 Golang
索尼ICF-5900W收音机测评
2022/04/24 无线电