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


Posted in Javascript onJune 30, 2014

使用比较暴力的手段禁用鼠标右键是不人性化的,所以最好还是有选择性的禁用鼠标右键。

代码实例如下:

<!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也可以禁用右键菜单了

Javascript 相关文章推荐
Domino中运用jQuery读取视图内容的方法
Oct 21 Javascript
javascript中的关于类型转换的性能优化
Dec 14 Javascript
JS中如何设置readOnly的值
Dec 25 Javascript
js实现内容显示并使用json传输数据
Mar 16 Javascript
json定义及jquery操作json的方法
Oct 03 Javascript
js实现点击图片自动提交action的简单方法
Oct 16 Javascript
关于微信jssdk实现多图片上传的一点心得分享
Dec 13 Javascript
微信小程序开发之map地图实现教程
Jun 08 Javascript
详解bootstrap用dropdown-menu实现上下文菜单
Sep 22 Javascript
JS实现头条新闻的经典轮播图效果示例
Jan 30 Javascript
JS使用cookie保存用户登录信息操作示例
May 30 Javascript
JS代码优化的8点建议
Feb 04 Javascript
javascript时间函数大全
Jun 30 #Javascript
js取得html iframe中的元素和变量值
Jun 30 #Javascript
原生JS绑定滑轮滚动事件兼容常见浏览器
Jun 30 #Javascript
js实现的点击div区域外隐藏div区域
Jun 30 #Javascript
js实现特定位取反原理及示例
Jun 30 #Javascript
如何书写高质量jQuery代码(使用jquery性能问题)
Jun 30 #Javascript
jQuery+ajax实现鼠标单击修改内容的思路
Jun 29 #Javascript
You might like
php addslashes 函数详细分析说明
2009/06/23 PHP
在php和MySql中计算时间差的方法
2011/04/22 PHP
PHP实现多文件上传的方法
2015/07/08 PHP
基于php实现随机合并数组并排序(原排序)
2015/11/26 PHP
详解PHP文件的自动加载(autoloading)
2018/02/04 PHP
基于jQuery的动态表格插件
2011/03/28 Javascript
基于JQuery实现CheckBox全选全不选
2011/06/27 Javascript
javascript firefox 自动加载iframe 自动调整高宽示例
2013/08/27 Javascript
javascript调试过程中找不到哪里出错的可能原因
2013/12/16 Javascript
java和javascript获取word文档的书签位置对比
2014/06/19 Javascript
JS实现表单中checkbox对勾选中增加边框显示效果
2015/08/21 Javascript
jquery实现定时自动轮播特效
2015/12/10 Javascript
js和jquery分别验证单选框、复选框、下拉框
2015/12/17 Javascript
基于jquery实现简单的分页控件
2016/03/17 Javascript
动态的9*9乘法表效果的实现代码
2016/05/16 Javascript
详解vue 自定义组件使用v-model 及探究其中原理
2019/10/11 Javascript
Vue3新特性之在Composition API中使用CSS Modules
2020/07/13 Javascript
js利用iframe实现选项卡效果
2020/08/09 Javascript
[03:42]2014DOTA2西雅图国际邀请赛 Navi战队巡礼
2014/07/07 DOTA
[01:02]DOTA2上海特锦赛SHOWOPEN
2016/03/25 DOTA
python通过cookie模拟已登录状态的初步研究
2016/11/09 Python
python中字符串比较使用is、==和cmp()总结
2018/03/18 Python
python实现kNN算法识别手写体数字的示例代码
2019/08/16 Python
Python版中国省市经纬度
2020/02/11 Python
python+selenium+chrome实现淘宝购物车秒杀自动结算
2021/01/07 Python
HTML5 SEO优化的一些建议
2020/08/27 HTML / CSS
文秘专业个人求职信
2013/12/22 职场文书
投标邀请书范文
2014/01/31 职场文书
我的中国梦演讲稿600字
2014/08/19 职场文书
2014年高三班主任工作总结
2014/12/05 职场文书
晚会开幕词
2015/01/28 职场文书
2016教师学习教育法心得体会
2016/01/19 职场文书
中学生打架《检讨书》范文
2019/08/12 职场文书
如何用python插入独创性声明
2021/03/31 Python
Nginx 安装SSL证书完成HTTPS部署
2022/04/28 Servers
Win11 Beta 预览版 22621.575 和 22622.575更新补丁KB5016694发布(附更新内容大全)
2022/08/14 数码科技