javascript: fireEvent方法

上一篇 / 下一篇  2008-04-08 16:55:03 / 个人分类:编程语言

在DHTML开发中,微软在其DOM中为每个元素实现了一个fireEvent方法。我们知道HTML的事件onXXX可以由系统(IE环境)来管理和触发,也可以直接执行事件的handler,比如onclick,如果被赋予事件处理函数,我们可以用element.onclick()来执行事件处理函数。那么fireEvent用来干嘛呢?

    在MSDN中fireEvent的描述很简单:Fires a specified event on the object.ITPUB个人空间#Rk$M`IrVX
    bFired = object.fireEvent(sEvent [, oEventObject])

    并且MSDN给出了一个使用fireEvent的示例:ITPUB个人空间-K}P;Wfk3@5xn!R@
<HTML>
`VcM F K,u:t0    <HEAD>
GJC2yU]1H-q%q E0        <SCRIPT>ITPUB个人空间9bNR@ e4i7HwZ
        function fnFireEvents()ITPUB个人空间:I-z V |BN
        {
1B6p D1b:_h0            div.innerText = "The cursor has moved over me!";ITPUB个人空间 \*kz9Ug*V6[
            btn.fireEvent("onclick");ITPUB个人空间#K%a-Obo3IO$ozO
        }
*L!kE{Cn0        </SCRIPT>
7T'C h f].m8aN0    </HEAD>ITPUB个人空间)Q5l9qd7J5y$r&x4gy\
    <BODY>
~|F3r7]3@xD~:A bE0        <h1>Using the fireEvent method</h1>
O _h:]n[J0        By moving the cursor over the DIV below, the button is clicked.
%s%HnTN G pk0        <DIV ID="div" nmouseover="fnFireEvents();">
*d?)Ze!_^Z7l0            Mouse over this!
.ztb#@&sn3|0        </DIV>ITPUB个人空间a6k8Qccb.b
        <BUTTON ID="btn" NCLICK="this.innerText='I have been clicked!'">Button</BUTTON>ITPUB个人空间;F%FY5se$p
    </BODY>
1Q6E@%[J0</HTML>

    这个示例非常的简单,也完全说明了fireEvent的用法。不过这个示例有一点误导我们,从而让我们不容易发现frieEvent更有价值的使用方法。由于button的onclick事件被赋予语句:this.innerText = 'I have been clicked!',这里很容易误导我们,fireEvent产生的是执行了btn.onclick()的效果。嗯,确实是这个效果,但是意义却完全不同, btn.onclick()只是一个函数调用,它的执行必须依赖于用户对其赋值,否则btn.onclick为null,是不能执行 btn.onclick()的。而fireEvent('onclick')的效果,"等同于"鼠标在button元素上进行了点击。

    由于IE的事件处理是bubble up方式,fireEvent(sEvent)就显得更加的有意义了,如果我们在一个table元素<table>中监听事件,比如 onclick,当点击不同的td做出不同的响应时。如果使用程序来模拟,只能使用fireEvent这种方式,示例如下:
]2Q0bl!Q{8ti ?6b3z"h0<table border="1" nclick="alert(event.srcElement.innerText);">ITPUB个人空间h1W)TWu
    <tr>ITPUB个人空间Z%mG,U!PB.e"A
        <td id="abc">abc</td>
/x7gt0wI0        <td id="def">def</td>
vc3nx a!j0    </tr>ITPUB个人空间I.[G"buI
</table>
~kvd4|,az!B;q4n0<button nclick="abc.fireEvent('onclick')">ITPUB个人空间e,N.JhjNv;|!a
    abc</button>
"jFhLX#V0<button nclick="def.fireEvent('onclick')">
$d(D$zg?v%M l!k0    def</button>

    使用abc.onclick()和def.onclick()将得到"Object doesn't support this property or method"异常。

  ITPUB个人空间SD WyM_{/ng
abc  def

    abc def

    知道了fireEvent的用法,那么我们用它来做什么呢?在开发具有复杂事件处理动作组件时。有时我们需要从程序中去触发一个本身因该鼠标或键盘触发的事件,比如在TreeView控件中,我们一般是使用鼠标点击来Expand&Collapse一个结点,如果我们要用程序代码来实现这个操作怎么办呢?当然直接执行事件处理函数是可以的,不过如果事件处理函数依赖于event变量中的状态值,那么就必须使用fireEvent方法。

    原来我曾经说过,因该把事件处理的函数封装起来,便于直接调用。比如上面说到的TreeView节点的Expand和Collapse,我在TreeView控件中都是把它们封装成两个函数Expand和Collapse,在节点被点击时,执行:ITPUB个人空间F#Zo%c.nz
 OpIcon.onclick = function()ITPUB个人空间^8i{%t"W0wJ
 {
t/bCm wO,I}6aFwT0     var bjNode = this.Object;ITPUB个人空间xMy/} nPo/n\W&j
     if ( objNode.m_IsExpanded )
$O4f1VP~?0         objNode.Collapse();
|2q8a._[c%n:`6|?0     elseITPUB个人空间3DVn+t'Wo
         objNode.Expaned();
*Z`%U-`$G+W2D)v0 }

    这样一来,在程序中控制Expand和Collapse也就是分别执行函数而已。不过后来发现既然DOM中有fireEvent方法,似乎我在"动态载入数据的无刷新TreeView控件(4)"中的某些想法也不是很必要了。ITPUB个人空间qpCK;A8h
ITPUB个人空间$?/[` X2JS@!e8[

转载:http://www.cnblogs.com/birdshome/archive/2005/04/07/128182.html


TAG:

引用 删除 yuyu1984   /   2008-05-07 13:36:41
5
 

评分:0

我来说两句

显示全部

:loveliness: :handshake :victory: :funk: :time: :kiss: :call: :hug: :lol :'( :Q :L ;P :$ :P :o :@ :D :( :)

Open Toolbar