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


Posted in Javascript onDecember 21, 2011

因为最近技术长进缓慢,也没高手带,只能靠自己了,所以想仿个WEBQQ来锻炼下自己。做之前最好先把必要的东西准备好。jquery其实本身的事件机制就很完善了,包括了单击,双击,鼠标移入,鼠标移出等。但是却少了一个做事件。就是鼠标右击事件。当然大家也是直接用侦听鼠标按下事件,然后通过if来判断执行相应的函数。造成鼠标右击事件的效果。

但是这不是我想要的,我想要的似乎这个事件可以跟其它事件比如单击事件一样。可以被方便的使用,而不需要每次都去判断。这里通过编写jquery插件的形式扩展,让这个方法可以直接使用$().rightClick();来使用。

jQuery的插件主要分3种类型

1.封装对象方法的插件

(这种插件是将对象封装起来,用于对通过选择器获取的对象进行操作,也就是这里需要用到的方法)

2.封装全局函数的插件

(可以将独立的函数加入到jquery的命名空间下)

3.选择器插件

(虽然jquery的选择器已经很强大了,但还是会需要扩展一些自己喜欢的选择器)

其它的一些关于插件的知识大家可以自己去查阅相关资料。这里就直接开始讲了。

这里是使用的第一种插件类型,先分析下具体的编写思路。

1.使用鼠标右键事件后,将禁止所有的系统右键菜单功能

2.绑定鼠标右键事件后,实际是触发鼠标按下事件。

3.通过if来判断,如果按下的是右键则执行参数,这个参数只能是函数。如果不是右键则不执行。

相信讲到这里,对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);

$(document).ready(function(e){ 
$("body").rightClick(function()(alert("右键单击"))); 
});

jquery事件机制扩展,jquery鼠标右键事件。
使用方法跟其它事件一样
Javascript 相关文章推荐
基于jquery的tab切换 js原理
Apr 01 Javascript
ASP.NET jQuery 实例1(在TextBox里面创建一个默认提示)
Jan 13 Javascript
深入理解JavaScript编程中的原型概念
Jun 25 Javascript
举例说明如何为JavaScript的方法参数设置默认值
Nov 17 Javascript
Bootstrap Modal遮罩弹出层代码分享
Nov 21 Javascript
JS正则子匹配实例分析
Dec 22 Javascript
JS实现旋转木马式图片轮播效果
Jan 18 Javascript
jQuery实现别踩白块儿网页版小游戏
Jan 18 Javascript
VUE实现日历组件功能
Mar 13 Javascript
React事件处理的机制及原理
Dec 03 Javascript
在pycharm中开发vue的方法步骤
Mar 04 Javascript
vue-router的hooks用法详解
Jun 08 Javascript
DIV外区域Click后关闭DIV的实现代码
Dec 21 #Javascript
用JSON做数据传输格式中的一些问题总结
Dec 21 #Javascript
40款非常有用的 jQuery 插件推荐(系列一)
Dec 21 #Javascript
这段js代码得节约你多少时间
Dec 20 #Javascript
js实现的仿新浪微博完美的时间组件升级版
Dec 20 #Javascript
非主流的textarea自增长实现js代码
Dec 20 #Javascript
javascript之querySelector和querySelectorAll使用介绍
Dec 20 #Javascript
You might like
法兰绒滤网冲泡
2021/03/03 冲泡冲煮
第三节--定义一个类
2006/11/16 PHP
php使用wordwrap格式化文本段落的方法
2015/03/17 PHP
实例简介PHP的一些高级面向对象编程的特性
2015/11/27 PHP
PHP实现文件上传与下载实例与总结
2016/03/13 PHP
php使用pear_smtp发送邮件
2016/04/15 PHP
Aster vs Newbee BO5 第二场2.19
2021/03/10 DOTA
IE JS编程需注意的内存释放问题
2009/06/23 Javascript
20个非常有用的PHP类库 加速php开发
2010/01/15 Javascript
javascript取消文本选定的实现代码
2010/11/14 Javascript
为jQuery增加join方法的实现代码
2010/11/28 Javascript
jquery自定义类似$.ajax()的方法实现代码
2013/08/13 Javascript
基于jquery实现的可编辑下拉框实现代码
2014/08/02 Javascript
jquery果冻抖动效果实现方法
2015/01/15 Javascript
Jquery实现地铁线路指示灯提示牌效果的方法
2015/03/02 Javascript
js实现文本框支持加减运算的方法
2015/08/19 Javascript
jQuery 1.9.1源码分析系列(十四)之常用jQuery工具
2015/12/02 Javascript
微信小程序 页面传值详解
2017/03/10 Javascript
js判断是否是手机页面
2017/03/17 Javascript
seajs模块压缩问题与解决方法实例分析
2017/10/10 Javascript
微信小程序实现留言板
2018/10/31 Javascript
基于ts的动态接口数据配置的详解
2019/12/18 Javascript
JS中循环遍历数组的四种方式总结
2021/01/23 Javascript
python以环状形式组合排列图片并输出的方法
2015/03/17 Python
Python使用logging结合decorator模式实现优化日志输出的方法
2016/04/16 Python
Python连接数据库学习之DB-API详解
2017/02/07 Python
Python3使用SMTP发送带附件邮件
2020/06/16 Python
python生成13位或16位时间戳以及反向解析时间戳的实例
2020/03/03 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
CSS3 @media的基本用法总结
2019/09/10 HTML / CSS
Canvas绘制浮动球效果的示例
2017/12/29 HTML / CSS
出纳员岗位责任制
2014/02/11 职场文书
检讨书范文500字
2015/01/28 职场文书
介绍信的写法
2015/01/31 职场文书
冰峪沟导游词
2015/02/09 职场文书
创业计划书之o2o水果店
2019/08/30 职场文书