jQuery 实现观察者模式
github:
https://github.com/mmikowski/jquery.event.gevent
demo:
$('body').append( "<div id='spa-chat-list-box' />" );
var $listbox = $('#spa-chat-list-box');
$listbox.css({
position : "absolute",
'z-index' : "3",
top : "50",
left : "50",
width : "50",
height : "50",
border : "2px solid #ccc",
background : "#fff",
})
var onListchange = function ( event, update_map ){
$( this ).html(update_map.list_text);
alert("onListchange");
}
/* 订阅事件 */
$.gevent.subscribe(
$listbox,
'spa-listchange',
onListchange
);
/* 发布通知 */
$.gevent.publish(
'spa-listchange',
[{ list_text : 'the list is here'}]
);
/* 删除元素的话,订阅的事件也会删除 */
$listbox.remove();
$.gevent.publish('spa-listchange',[ { } ]);
jQuery 实现观察者模式的更多相关文章
- jQuery的观察者模式详解 转载
jQuery的观察者模式详解 投稿:hebedich 本文主要是介绍了jQuery中on方法及trigger方法,以及围绕这个方法来体验的观察者模式,是篇非常不错的文章,对我们理解观察者模式很有帮助. ...
- jQuery中的观察者模式(Observer Pattern)
在jQuery中,on方法可以为元素绑定事件,trigger方法可以手动触发事件,围绕这2个方法,我们来体验jQuery中的观察者模式(Observer Pattern). ■ on方法绑定内置事件, ...
- jQuery 2.0.3 源码分析 回调对象 - Callbacks
源码API:http://api.jquery.com/jQuery.Callbacks/ jQuery.Callbacks()是在版本1.7中新加入的.它是一个多用途的回调函数列表对象,提供了一种强 ...
- js/jquery/html前端开发常用到代码片段
1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...
- jquery 之 Deferred 使用与实现
观察者模式是开发中经常使用的模式,这个模式由两个主要部分组成:主题和观察者.通过观察者模式,实现主题和观察者的解耦. 主题负责发布内容,而观察者则接收主题发布的内容.通常情况下,观察者都是多个,所以, ...
- jQuery.Deferred 源码分析
作者:禅楼望月(http://www.cnblogs.com/yaoyinglong ) 1 引子 观察者模式是我们日常开发中经常用的模式.这个模式由两个主要部分组成:发布者和观察者.通过观察者模式, ...
- 读jQuery源码 - Deferred
Deferred首次出现在jQuery 1.5中,在jQuery 1.8之后被改写,它的出现抹平了javascript中的大量回调产生的金字塔,提供了异步编程的能力,它主要服役于jQuery.ajax ...
- 第十七章:jQuery类库
javascript的核心API设计的很简单,但由于浏览器之间的不兼容性,导致客户端的API过于复杂.IE9的到来缓解了这种情况.然而使用javascript的框架或者工具类库,能简化通用操作,处理浏 ...
- JQuery源码解析(九)
jQuery回调对象 jQuery.Callbacks一般开发者接触的很少,虽然jQuery向开发者提供了外部接口调用,但是$.Callbacks()模块的开发目的是为了给内部$.ajax() 和 $ ...
随机推荐
- Floyd-弗洛伊德算法
今天,研究一下谁都能看懂的弗洛伊德算法. 首先,弗洛伊德算法是一种利用动态规划的思想寻找给定的加权图中多源点之间最短路径的算法. 这个算法需要一个用到一个二维数组啊a[][],而a[i][j]表示的就 ...
- error和exception的区别
------解决方法--------------------------------------------------------了解异常与错误的区别,并且知道当你截获一个异常时,应该怎么办. ...
- [BZOJ 3571] 画框
Link: BZOJ 3571 传送门 Solution: 和 BZOJ2395 的建模完全相同,(BZOJ2395 题解传送门) 仅仅是将其中的基础问题由最小生成树改成了二分图最大完美匹配 只要将原 ...
- CodeChef - UASEQ Chef and sequence
Read problems statements in Mandarin Chinese and Russian. You are given an array that consists of n ...
- POJ 2115 C Looooops(Exgcd)
[题目链接] http://poj.org/problem?id=2115 [题目大意] 求for (variable = A; variable != B; variable += C)的循环次数, ...
- 【博弈论】【SG函数】【枚举】bzoj1188 [HNOI2007]分裂游戏
因为第i个瓶子里的所有豆子都是等价的,设sg(i)表示第i个瓶子的sg值,可以转移到sg(j)^sg(k)(i<j<n,j<=k<n)的状态. 只需要考虑豆子数是奇数的瓶子啦, ...
- Android 架构 1.架构
项目分为了四个层级:模型层.接口层.核心层.界面层.模型层定义了所有的模型:接口层封装了服务器提供的API:核心层处理所有业务逻辑:界面层就处理界面的展示.几个层级之间的关系如下图所示: 层级关系:模 ...
- Android Studio 首次安装取消自动下载SDK
一.第一次安装: Android Studio安装完成后,第一次启动AS前,为了避免重新下载新版本的SDK,需要做如下操作: AS启动前,打开安装目录,请先将bin目录的idea.properties ...
- Word调整表格大小
在Word文档中创建表格后,用户往往需要根据输入的内容调整表格的行高和列宽,有时也需要对整个表格的大小进行调整. 在选择的表格上右击,选择快捷菜单中的“自动调整”—“根据内容调整表格”命令,Word将 ...
- jquery.mobile 中 collapsible-set collapsible listview 共同布局问题
最近项目用上了jquery.mobile这货,在手机上做点简单的显示.之前只知道有这个框架,没把玩过. 特别是事件绑定方面,相比桌面系统下浏览器用着各种不爽,不得要领. 如下图,在做后台系统时,一般左 ...