当前位置: 首页 > 图文教程 > 网络编程 > Javascript > extjs 为某个事件设置拦截器

Javascript
javascript innerText和innerHtml应用
图像替换新技术 状态域方法
JavaScript 判断判断某个对象是Object还是一个Array
Extjs 几个方法的讨论
JavaScript 学习笔记(十五)
javascript 匿名函数的理解(透彻版)
Jquery 常用方法经典总结
jquery 批量上传图片实现代码
javascript中的array数组使用技巧
详细讲解JS节点知识
javascript让setInteval里的函数参数中的this指向特定的对象
javaScript 关闭浏览器 (不弹出提示框)
对字符串进行HTML编码和解码的JavaScript函数
javascript 三种编解码方式
js左侧多级菜单动态的解决方案
JavaScript 学习笔记(十六) js事件
JavaScript面向对象之静态与非静态类
javascript两段代码,两个小技巧
js中鼠标滚轮事件详解(firefox多浏览器)
js实现的仿Photoshop鼠标滚轮控制输入框取值(修正兼容Chrome)

Javascript 中的 extjs 为某个事件设置拦截器


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-20   浏览: 319 ::
收藏到网摘: n/a

Ext.util.Observable有一个重要的功能,可以为某个事件设置拦截器,统一管理方法的处罚。使用capture()和releaseCapture()来实现这个功能。 我们先来自定义一个事件:
复制代码 代码如下:

person = function(name) {
this.name = name;
this.addEvents("walk");
}
Ext.extend(person, Ext.util.Observable, {
info: function(event) {
return this.name + 'is' + event + 'ing.';
}
});
var person = new person('张铭诺');
person.on('walk', function() {
Ext.Msg.alert('event', person.name + '在走啊走啊。');
});

然后我们再定义一个按钮用来触发这个walk事件:
复制代码 代码如下:

var btn = new Ext.Button({
id: 'walk',
text: '触发事件按钮',
renderTo: Ext.getBody()
});
btn.on('click', function() {
person.fireEvent('walk');
});

当点击按钮时触发事件,效果如下图所示:

现在我们使用capture()函数拦截事件的触发,如下面的代码所示:
复制代码 代码如下:

var btn2 = new Ext.Button({
id: 'cc',
text: '拦截事件',
renderTo: Ext.getBody()
});
btn2.on('click', function() {
Ext.util.Observable.capture(person, function() {
alert('fsdjhf');
return true;
});
});

这时单击btn2按钮,发现弹出对话框后还会触发事件,郁闷。。。。现在将最后一行代码改为return false试试?事件被拦截成功了吧!
  这样就给我们一个选择的机会,通过控制capture()中处理函数的返回值来决定是否继续执行某个时间的监听函数,还是直接中止该事件的发生。
我们还可以为一个对象设置多个capture()拦截函数,这些拦截函数会形成一个处理链条,只要其中任何一个拦截函数返回false,就会中止处理过程。
releaseCapture()函数是capture()函数的反向操作,它会一次性清除fireEvent()上所有的拦截函数,不过我们无法通过它准确的删除某一个拦截函数。一旦执行了releaseCapture(),那么之前设置的所有拦截函数就都失效了。