JQuery自定义事件的应用 JQuery最佳实践


Posted in Javascript onAugust 01, 2010

知识要点:

1,自定义事件custom events及事件的订阅

2,trigger、bind、unbind方法的使用

3,带命名空间的自定义事件

将下面内容粘贴至txt文档后再直接粘贴至firebug的控制台,运行看看。

/* 
JQuery自定义事件的应用-Javascript OO 
有一帅哥叫Levin,在某公司前端设计部工作,他的主管是大帅哥A,经理是大美眉B。 
领导们希望可以抽空瞄瞄这家伙每周的工作情况,于是。。。 
Levin每周一要用google doc写一份关于上周工作的总结,并被要求写完后要MSN通知A和B。。。 
Levin非常乐意做周总结,但是他提出了一个建议: 
既然我用google doc写好了,你们喜欢看便用google reader订阅我的文档更新吧,我不喜欢用微软的MSN。。。 这丫...A和B头顶乌鸦飘了几秒,但欣然答应。 
*/

//这个是Levin同学
var Levin={name:"Levin"}; 
Levin=$(Levin);

//每周要写周总结

Levin.bind("evt_weeklyReport",function(evt){ 
alert(this.name+"高呼:Yeah!周总结已经写好啦."); 
});

//主管A

var A={name:"帅哥A"};

//他要订阅Levin的周总结
A.rssLevin=function(){ 
Levin.bind("evt_weeklyReport.fromA",function(evt,data){ 
alert(A.name+":嗯,不错,Levin还是挺积极的嘛!"); 
}) 
}; 
A.rssLevin();

//经理B
var B={name:"美眉B"};

//她也订阅Levin的周总结

B.rssLevin=function(){ 
Levin.bind("evt_weeklyReport.fromB",function(evt,data){ 
alert(B.name+":周总结呆会看,先看看他说的那个网站"); 
window.location=evt.site; 
}) 
}; 
B.rssLevin();

//每次Levin同学写好周总结后便会用google doc发布一下

Levin.trigger({type:"evt_weeklyReport",site:"http://3water.com"});

//经理B突然有一天去搜狐做了,不再订阅Levin的周结...
[code]
B.unRssLevin=function(){
alert("我要去搜狐做副总裁啦,哈哈");
Levin.unbind("evt_weeklyReport.fromB");
return true;
}();
[html]

//尽管B跳槽了,周总结还是要按时发布的。。。

Levin.trigger({type:"evt_weeklyReport",site:"http://3water.com"});
Javascript 相关文章推荐
利用javascript/jquery对上传文件格式过滤的方法
Jul 25 Javascript
IE与Firefox在JavaScript上的7个不同句法分享
Oct 30 Javascript
js+html+css实现鼠标移动div实例
Jan 30 Javascript
JS中获取函数调用链所有参数的方法
May 07 Javascript
jQuery实现checkbox全选的方法
Jun 10 Javascript
Bootstrap基本组件学习笔记之input输入框组(9)
Dec 07 Javascript
基于JavaScript实现窗口拖动效果
Jan 18 Javascript
vue2中使用less简易教程
Mar 27 Javascript
vue如何判断dom的class
Apr 26 Javascript
解决vue axios的封装 请求状态的错误提示问题
Sep 25 Javascript
JSON.stringify()方法讲解
Jan 31 Javascript
layUI实现列表查询功能
Jul 27 Javascript
基于jquery的实现简单的表格中增加或删除下一行
Aug 01 #Javascript
Jquery从头学起第四讲 jquery入门教程
Aug 01 #Javascript
关于jquery动态增减控件的一些想法和小插件
Aug 01 #Javascript
jQuery的实现原理的模拟代码 -2 数据部分
Aug 01 #Javascript
jQuery的实现原理的模拟代码 -1 核心部分
Aug 01 #Javascript
jQuery validate 中文API 附validate.js中文api手册
Jul 31 #Javascript
jQuery对象[0]是什么含义?
Jul 31 #Javascript
You might like
dedecms系统的广告设置代码 基础版本
2010/04/09 PHP
PHP基本语法总结
2014/09/06 PHP
列表内容的选择
2006/06/30 Javascript
jQuery选择器的工作原理和优化分析
2011/07/25 Javascript
javascript 快速排序函数代码
2012/05/30 Javascript
javascript提取URL的搜索字符串中的参数(自定义函数实现)
2013/01/22 Javascript
通过JavaScript使Div居中并随网页大小改变而改变
2013/06/24 Javascript
javascript将浮点数转换成整数的三个方法
2014/06/23 Javascript
深入探寻seajs的模块化与加载方式
2015/04/14 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
2015/08/22 Javascript
功能强大的Bootstrap使用手册(一)
2016/08/02 Javascript
利用nodejs监控文件变化并使用sftp上传到服务器
2017/02/18 NodeJs
JS使用面向对象技术实现的tab选项卡效果示例
2017/02/28 Javascript
利用JavaScript在网页实现八数码启发式A*算法动画效果
2017/04/16 Javascript
JS返回顶部实例代码
2020/08/09 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
2017/12/13 Javascript
[01:30:55]VG vs Mineski Supermajor 败者组 BO3 第三场 6.6
2018/06/07 DOTA
解析Python中的生成器及其与迭代器的差异
2016/06/20 Python
Python numpy实现数组合并实例(vstack,hstack)
2018/01/09 Python
python将秒数转化为时间格式的实例
2018/09/16 Python
Django Channels 实现点对点实时聊天和消息推送功能
2019/07/17 Python
Python模拟登录之滑块验证码的破解(实例代码)
2019/11/18 Python
python3 循环读取excel文件并写入json操作
2020/07/14 Python
英国川宁茶官方网站:Twinings茶
2019/05/21 全球购物
FC-Moto英国:欧洲最大的摩托车服装和头盔商店之一
2019/08/25 全球购物
英国顶级足球鞋的领先零售商:Lovell Soccer
2019/08/27 全球购物
成人高等教育毕业生自我鉴定
2013/10/22 职场文书
教师绩效考核方案
2014/01/21 职场文书
高二化学教学反思
2014/01/30 职场文书
2015年民主生活会发言材料
2014/12/15 职场文书
供应商食品安全承诺书
2015/04/29 职场文书
《打电话》教学反思
2016/02/22 职场文书
最新农村养殖致富:资金投入较低的创业项目有哪些?
2019/09/26 职场文书
python 中yaml文件用法大全
2021/07/04 Python
Redis性能监控的实现
2021/07/09 Redis
MySQL创建定时任务
2022/01/22 MySQL