在設(shè)計(jì)ExtJS應(yīng)用程序時(shí)最常做的事情就是注冊(cè)事件處理程序，因?yàn)樵贓xtJS的世界里，幾乎完全由時(shí)間組成。因此，ExtJS的設(shè)計(jì)者使注冊(cè)事件變得非常容易(同時(shí)還提供了非常不容易的方式任你選擇)——on/un，也就是上與下兩種方式，或是addListener與removeListener，Element的所有子類都可以使用。例如有一個(gè)<div/>希望在用戶按下時(shí)能夠給予簡單的反饋：
<divid="happyDiv"class="happyStyle"/>
如何替這個(gè)<div/>注冊(cè)鼠標(biāo)單擊事件呢？首先必須取得這個(gè)div的Element實(shí)例：
varhappyDiv=Ext.get('happyDiv');
然后是定義事件處理程序：

再用on()將事件處理函數(shù)與Element實(shí)例連接起來：

程序執(zhí)行時(shí)，單擊<div/>會(huì)出現(xiàn)圖3-15所示的結(jié)果。
很簡單，對(duì)吧？示例文件為ch03/event_demo.html。如果要移除這個(gè)事件處理程序，只需要把on()改為un()即可。移除時(shí)沒有對(duì)應(yīng)click事件的事件處理程序也沒有關(guān)系，底層的EventManager會(huì)自行判斷。事件處理程序被調(diào)用時(shí)會(huì)接收三個(gè)參數(shù)——event、eventTarget和optionObj，示例中只用到兩個(gè)，第三個(gè)參數(shù)會(huì)在討論EventManager時(shí)加以說明。這里先將焦點(diǎn)放在event與eventTarget上，event的類型是Ext.Event，eventTarget則是HTML元素。瀏覽器在用戶按下<div/>時(shí)觸發(fā)click事件并且調(diào)用clickHanlder()，對(duì)于clickHanlder()而言，接收到的event就是瀏覽器觸發(fā)的click事件。evnetTarget就是事件目標(biāo)，也就是<div/>，eventTarget.id的值就是“happyDiv”。至于事件的根類，應(yīng)該去哪里尋找呢？答案

最新評(píng)論