jquery事件机制扩展插件 jquery鼠标右键事件。


Posted in Javascript onDecember 26, 2011

jquery其实本身的事件机制就很完善了,包括了单击,双击,鼠标移入,鼠标移出等。但是却少了一个做事件。就是鼠标右击事件。当然大家也是直接用侦听鼠标按下事件,然后通过if来判断执行相应的函数。造成鼠标右击事件的效果。
但是这不是我想要的,我想要的似乎这个事件可以跟其它事件比如单击事件一样。可以被方便的使用,而不需要每次都去判断。这里通过编写jquery插件的形式扩展,让这个方法可以直接使用$().rightClick();来使用。
jQuery的插件主要分3种类型
1.封装对象方法的插件
(这种插件是将对象封装起来,用于对通过选择器获取的对象进行操作,也就是这里需要用到的方法)
2.封装全局函数的插件
(可以将独立的函数加入到jquery的命名空间下)
3.选择器插件
(虽然jquery的选择器已经很强大了,但还是会需要扩展一些自己喜欢的选择器)
其它的一些关于插件的知识大家可以自己去查阅相关资料。这里就直接开始讲了。
这里是使用的第一种插件类型,先分析下具体的编写思路。
1.使用鼠标右键事件后,将禁止所有的系统右键菜单功能
2.绑定鼠标右键事件后,实际是触发鼠标按下事件。
3.通过if来判断,如果按下的是右键则执行参数,这个参数只能是函数。如果不是右键则不执行。
相信讲到这里,对jquery很熟悉的也明白要怎么做了。
jquery事件机制扩展插件 jquery鼠标右键事件。

jquery事件机制扩展,jquery鼠标右键事件。

/*鼠标右键插件*/ 
(function($) { 
$.fn.extend({ 
//定义鼠标右键方法,接收一个函数参数 
"rightClick":function(fn){ 
//调用这个方法后将禁止系统的右键菜单 
$(document).bind('contextmenu',function(e){ 
return false; 
}); 
//为这个对象绑定鼠标按下事件 
$(this).mousedown(function(e){ 
//如果按下的是右键,则执行函数 
if(3 == e.which){ 
fn(); 
} 
}); 
} 
}); 
})(jQuery);

Javascript 相关文章推荐
跨域表单提交状态的变相判断代码
Nov 12 Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
Mar 07 Javascript
如何让div span等元素能响应键盘事件操作指南
Nov 13 Javascript
JS网页播放声音实现代码兼容各种浏览器
Sep 22 Javascript
使用typeof方法判断undefined类型
Sep 09 Javascript
JS+CSS实现简单的二级下拉导航菜单效果
Sep 21 Javascript
微信小程序 input输入框详解及简单实例
Jan 10 Javascript
ES6新特性五:Set与Map的数据结构实例分析
Apr 21 Javascript
基于 flexible 的 Vue 组件:Toast -- 显示框效果
Dec 26 Javascript
AnglarJs中的上拉加载实现代码
Feb 08 Javascript
微信小程序渲染性能调优小结
Jul 30 Javascript
layui 图片上传+表单提交+ Spring MVC的实例
Sep 21 Javascript
查看源码的工具 学习jQuery源码不错的工具
Dec 26 #Javascript
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
Dec 26 #Javascript
非常有用的40款jQuery 插件推荐(系列二)
Dec 25 #Javascript
JS代码优化技巧之通俗版(减少js体积)
Dec 23 #Javascript
关于跨站脚本攻击问题
Dec 22 #Javascript
js DOM的学习笔记
Dec 22 #Javascript
jquery 年会抽奖程序
Dec 22 #Javascript
You might like
php中ob(Output Buffer 输出缓冲)函数使用方法
2007/07/21 PHP
PHP 防恶意刷新实现代码
2010/05/16 PHP
laravel excel 上传文件保存到本地服务器功能
2019/11/14 PHP
js数字输入框(包括最大值最小值限制和四舍五入)
2009/11/24 Javascript
jquery tab插件制作实现代码
2010/06/22 Javascript
JS模拟面向对象全解(二、类型与赋值)
2011/07/13 Javascript
javascript数组去重3种方法的性能测试与比较
2013/03/26 Javascript
jQuery+CSS实现一个侧滑导航菜单代码
2016/05/09 Javascript
使用jQuery Mobile框架开发移动端Web App的入门教程
2016/05/17 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
2016/06/03 Javascript
使用JS批量选中功能实现更改数据库中的status状态值(批量展示)
2016/11/22 Javascript
vue2.x 父组件监听子组件事件并传回信息的方法
2017/07/17 Javascript
详解JavaScript按概率随机生成事件
2017/08/02 Javascript
JS中的多态实例详解
2017/10/15 Javascript
vue填坑之webpack run build 静态资源找不到的解决方法
2018/09/03 Javascript
15 分钟掌握vue-next响应式原理
2019/10/13 Javascript
javascript 原型与原型链的理解及应用实例分析
2020/02/10 Javascript
Python获取apk文件URL地址实例
2013/11/01 Python
python根据文件大小打log日志
2014/10/09 Python
Python 查看list中是否含有某元素的方法
2018/06/27 Python
python 获取一个值在某个区间的指定倍数的值方法
2018/11/12 Python
python获取本机所有IP地址的方法
2018/12/26 Python
10分钟教你用python动画演示深度优先算法搜寻逃出迷宫的路径
2019/08/12 Python
python中seaborn包常用图形使用详解
2019/11/25 Python
python GUI库图形界面开发之PyQt5窗口控件QWidget详细使用方法
2020/02/26 Python
Python应用实现处理excel数据过程解析
2020/06/19 Python
Python多线程的退出控制实现
2020/08/10 Python
python向xls写入数据(包括合并,边框,对齐,列宽)
2021/02/02 Python
利用三角函数在canvas上画虚线的方法
2018/01/11 HTML / CSS
毕业生护理专业个人求职信范文
2014/01/04 职场文书
档案保密承诺书
2014/06/03 职场文书
预备党员群众意见
2015/06/01 职场文书
有关三国演义的读书笔记
2015/06/25 职场文书
详解CocosCreator消息分发机制
2021/04/16 Javascript
Golang实现AES对称加密的过程详解
2021/05/20 Golang
Mysql实现主从配置和多主多从配置
2021/06/02 MySQL