当前位置：首页 > 资讯 > 技术文档

jquery实现人性化的有选择性禁用鼠标右键

时间：2022-05-11 05:04 编辑：来源：阅读：
扫一扫，手机访问

摘要：jquery实现人性化的有选择性禁用鼠标右键

使用比较暴力的手段禁用鼠标右键是不人性化的，所以最好还是有选择性的禁用鼠标右键。代码实例如下:

<!DOCTYPE html> <html> 
<head> 
<meta charset="utf-8"> 
<meta name="author" content="http://www.45it.com/" /> 
<title>编程素材网</title> 
<style type="text/css">
html,body{height:100%}
div{
width:150px;
height:50px;
background:#CCC;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){
function jQuery_isTagName(ev,arr){
ev=$.event.fix(ev);
var target=ev.target||ev.srcElement;
if(arr&&$.inArray(target.tagName.toString().toUpperCase(),arr)==-1){
return false;
}
return true;
}

$(document).bind("contextmenu",function(ev){
if(!jQuery_isTagName(ev,['INPUT','TEXTAREA'])){
ev.preventDefault();
return false;
}
return true;
})
})
</script> 
</head> 
<body>
<div id="thediv"></div> 
<textarea></textarea>
</body> 
</html>

上面的代码实现了我们的要求，下面对代码的实现过程做一下介绍。代码注释: 1.$(document).ready(function(){})，当文本结构完全加载完毕再去执行函数中的代码。 2.function jQuery_isTagName(ev,arr){},此函数可以判断元素是否在可以使用右键菜单之列，第一个参数是事件对象，第二个参数是一个数组，数组元素是可以使用右键菜单的标签名称。 3.ev=$.event.fix(ev)，实现事件对象在各个浏览器的兼容性，fix()函数是jquery内部使用的，当然也可以这么用。 4.var target=ev.target||ev.srcElement，获取事件源对象。 5.if(arr&&$.inArray(target.tagName.toString().toUpperCase(),arr)==-1){return false;}，判断指定的标签元素是否在数组中，如果数组中没有指定的标签，那么就返回false。 6.return true，返回true。 8.$(document).bind("contextmenu",function(ev){})，为document文档注册contextmenu事件处理函数。 9.if(!jQuery_isTagName(ev,['INPUT','TEXTAREA'])){ ev.preventDefault(); return false; } 如果如果指定标签不在可以使用右键菜单的列表中，那么就使用ev.preventDefault()阻止事件冒泡，这很重要，否则的话如果有元素嵌套，虽然子元素禁用了右键菜单，但是右键子元素的时候，还是会弹出右键菜单，因为事件传递到父元素上去了，return false也可以禁用右键菜单了

全部评论(0)

上一篇：利用jquery实现瀑布流3种案例
下一篇：非常实用的12个jquery代码片段

资讯排行榜
更多>>