问题描述
var element = Ext.get('domid');var component = Ext.getCmp('domid') 各添加一个click事件element.on('click',function(){});component.on('click',function(){}); extjs源码中显示这两种添加事件方式是不同的。给element上添加事件会最终把事件绑定到dom元素上(最终是调用addEventListener or attachEvent)但是component添加事件只是记录了事件和回调函数的关系,然后fireEvent之后依次调用,并没有涉及到给dom元素添加事件。但是费解的是当你给component添加click时间的时候,却是可以触发的。不解。。。以下是 component 添加事件的行为(使用Observable的addListener) addListener : function(eventName, fn, scope, o){ var me = this, e, oe, isF, ce; if (ISOBJECT(eventName)) { o = eventName; for (e in o){ oe = o[e]; if (!me.filterOptRe.test(e)) { me.addListener(e, oe.fn || oe, oe.scope || o.scope, oe.fn ? oe : o); } } } else { eventName = eventName.toLowerCase(); ce = me.events[eventName] || TRUE; if (Ext.isBoolean(ce)) { me.events[eventName] = ce = new EXTUTIL.Event(me, eventName); } ce.addListener(fn, scope, ISOBJECT(o) ? o : {}); } } 这是 element添加事件的代码(使用EventManager的addListener,最终会添加click事件到dom上) addListener : function(eventName, fn, scope, options){ Ext.EventManager.on(this.dom, eventName, fn, scope || this, options); return this; } 问题补充:<div class="quote_title">chengjiang_lin 写道</div><div class="quote_div">new EXTUTIL.Event(me, eventName)</div><br /><br />但好像只是给组件加上 事件,我想知道 是怎么和dom联系起来的。<br />new Ext.util.Event 并不会绑定事件到dom上
解决方案
element.on('click',function(){}); 事件会最终把事件绑定到dom元素上component.on('click',function(){}); 事件已经在你NEW一个COMPONENT时绑定到DOM元素上了,只是这些绑定的事件是不允许使用者去修改的,否则的话EXTJ的COMPONENT可能就没法正常运转在NEW 一个COMPONENT时,EXTJS通过DOM元素的事件包装成了自己使用的一整套事件,这些事件就是在EXTJS API文档里可以查询到的当你component.on('click',function(){}); 时就是把一个事件绑定到EXTJS的组件上而不是DOM元素上;
解决方案二:
其实我不太懂你想问什么,如果调用addEventListener or attachEvent你认为是跟dom关联起来了,那你收一下,一定会涉及到。或者说你想问的是浏览器事件的机制?捕获型事件(非IE)、冒泡型事件(所有浏览器都支持)
解决方案三:
new EXTUTIL.Event(me, eventName)