以下故事纯属虚构,如有雷同为巧合...
本文主要介绍JQuery框架里面支持的自定义事件模型,通过实例说明什么时候可以利用事件模型进行面向对象的JS编程,以及利用“带命名空间的事件处理函数”来避免unbind时影响别的事件订阅。
知识要点:
1,自定义事件custom events及事件的订阅
2,trigger、bind、unbind方法的使用
3,带命名空间的自定义事件
将下面内容粘贴至txt文档后再直接粘贴至firebug的控制台,运行看看。
//这个是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://vivasky.com"});
//经理B突然有一天去搜狐做了,不再订阅Levin的周结...
B.unRssLevin=function(){
alert("我要去搜狐做副总裁啦,哈哈");
Levin.unbind("evt_weeklyReport.fromB");
return true;
}();
//尽管B跳槽了,周总结还是要按时发布的。。。
Levin.trigger({type:"evt_weeklyReport",site:"http://vivasky.com"});
分享到:
相关推荐
这篇博客文章可能是分享如何修改或自定义jQuery菜单插件的代码,以消除这种现象。 在实际的Web开发中,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理和动画效果。jQuery插件是开发者为了扩展...
Ajax无刷新分页(jQuery+Json) 做了一个用jQuery来实现的用户控件,VS2008+Access ...每页显示的记录条数在config里面设置(转载人标注:config里配置只是为了方面,也可在后台设置) 作者:刘巨
jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。在这个场景中,我们关注的是如何在前端展示日期,特别是对于中文用户友好的日期格式。 【描述】:虽然JavaScript内置...
此外,`.bind()` 和 `.trigger()` 方法分别用于绑定和触发自定义事件。jQuery 还提供了一套丰富的动画效果,如 `.fadeIn()`、`.slideUp()` 和 `.animate()`,使得创建平滑过渡和复杂动画变得简单。 AJAX 交互在 ...
4. **动画效果**: jQuery的`animate()`函数允许创建自定义动画,比如改变元素的宽度、高度、透明度等。同时,`fadeIn()`, `fadeOut()`, `slideToggle()`等预定义动画可快速实现常见效果。 5. **Ajax交互**: jQuery...
jQuery FormValidator还支持自定义验证规则。例如,如果我们需要验证密码强度,可以这样做: ```javascript $.formValidator.addRule("passwordStrength", function(value) { var strength = 0; // 检查长度、...
自定义样式和事件 该插件允许开发者自定义样式以适应不同的设计需求。例如,可以通过CSS类`pagination`、`page-item`、`active`等修改分页按钮的样式。同时,插件提供了一些内置事件,如`changePage`,可以在用户...
例如,使用jQuery添加一个点击事件来显示下拉列表: ```javascript $(document).ready(function() { $('.select-custom').on('click', function() { $(this).find('option').show(); }); }); ``` 如果想要实现...
9. **ch1_18基本事件.html**:进一步深入事件处理,可能包括自定义事件、事件委托等。 10. **ch1_7.html**:可能讲解了jQuery中的Ajax操作,如$.ajax()、$.get()、$.post()等,用于实现异步数据交互。 通过这些实例...
- **自定义动画**:也可以通过`.animate()`方法创建自定义动画序列。 ##### 6. 表格排序插件 - **tablesorter插件**:这是一个常用的jQuery插件,可以自动为表格添加排序功能。 - **插件使用**:只需在页面中引入...
jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理和动画等功能。在本项目中,jQuery可能被用来操作DOM元素,实现进度条的动态更新,例如通过改变进度条的宽度或填充色来反映进度的变化。 JavaScript...
2. 编写拦截代码,当检测到特定请求或事件时,阻止其执行或返回空响应。 3. 可能需要动态注入代码到QQ进程中,以便实时监控和处理弹窗行为。 4. 对于一些静态的、固定的弹窗,可能需要修改QQ的资源文件,删除或禁用...
(题外话:从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取最新的EasyUI资源 专题页地址如下http:http://download.csdn.net/album/detail/343 同时也希望转载的那些朋友能保留我资源...
8. **自定义插件**:jQuery的可扩展性允许开发人员创建自己的插件。这个"暴风影音jQuery焦点图"可能就是一个定制的jQuery插件,封装了上述的功能。 最后,对于这个实例,开发者需要注意版权问题。"本作品由【站长...
这篇【转载】的博客文章“常用的三种树形菜单”探讨了实现这种交互方式的不同技术。尽管没有提供具体的文章内容,我们可以基于这个主题来深入讨论树形菜单的基本概念、实现方式以及相关的编程技术和工具。 1. **...
- **JavaScript库**:如jQuery的`click`事件和`fadeIn`方法,或者更专业的图片库如Fancybox、Lightbox等,它们提供了丰富的自定义选项和动画效果。 - **响应式设计**:对于不同设备和屏幕尺寸,可以使用媒体查询(`...
zTree是一款基于jQuery的树形插件,广泛应用于网站的导航、目录展示、数据组织等场景。它以其强大的功能、灵活的配置和友好的API,深受开发者的喜爱。本文将深入探讨zTree的基本用法,帮助你快速上手。 ### 1. ...
3. JavaScript/jQuery:用于监听用户输入事件,实时过滤下拉选项,并处理自定义输入。 4. AJAX:异步数据加载,当用户输入时,动态地从服务器获取匹配的选项。 5. CSS:美化组件样式,使其符合界面设计要求。 6. ...
在这款产品图片展示切换中,jQuery可能被用来监听鼠标滑过事件,触发缩略图图片的切换。例如,使用`mouseenter`和`mouseleave`事件,当用户将鼠标悬停在缩略图上时,大图会显示相应的全尺寸图片。 其次,CSS3是CSS...