zoukankan      html  css  js  c++  java
  • 在什么时候才会用到fireEvent方法呢?

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

        在MSDN中fireEvent的描述很简单:Fires a specified event on the object.
        bFired = object.fireEvent(sEvent [, oEventObject])

        并且MSDN给出了一个使用fireEvent的示例:


    <HTML>
        <HEAD>
            <SCRIPT>
            function fnFireEvents()
            {
                div.innerText = "The cursor has moved over me!";
                btn.fireEvent("onclick");
            }
            </SCRIPT>
        </HEAD>
        <BODY>
            <h1>Using the fireEvent method</h1>
            By moving the cursor over the DIV below, the button is clicked.
            <DIV ID="div" onmouseover="fnFireEvents();">
                Mouse over this!
            </DIV>
            <BUTTON ID="btn" ONCLICK="this.innerText='I have been clicked!'">Button</BUTTON>
        </BODY>
    </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这种方式,示例如下:


    <table border="1" onclick="alert(event.srcElement.innerText);">
        <tr>
            <td id="abc">abc</td>
            <td id="def">def</td>
        </tr>
    </table>
    <button onclick="abc.fireEvent('onclick')">
        abc</button>
    <button onclick="def.fireEvent('onclick')">
        def</button>

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



        


    abc

    def


        abc def

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

        原来我曾经说过,因该把事件处理的函数封装起来,便于直接调用。比如上面说到的TreeView节点的Expand和Collapse,我在TreeView控件中都是把它们封装成两个函数Expand和Collapse,在节点被点击时,执行:


    OpIcon.onclick = function()
    {
         var objNode = this.Object;
         if ( objNode.m_IsExpanded )
             objNode.Collapse();
         else
             objNode.Expaned();
    }

        这样一来,在程序中控制Expand和Collapse也就是分别执行函数而已。不过后来发现既然DOM中有fireEvent方法,似乎我在"动态载入数据的无刷新TreeView控件(4)"中的某些想法也不是很必要了。
  • 相关阅读:
    背水一战 Windows 10 (90)
    背水一战 Windows 10 (89)
    背水一战 Windows 10 (88)
    背水一战 Windows 10 (87)
    背水一战 Windows 10 (86)
    背水一战 Windows 10 (85)
    背水一战 Windows 10 (84)
    背水一战 Windows 10 (83)
    背水一战 Windows 10 (82)
    背水一战 Windows 10 (81)
  • 原文地址:https://www.cnblogs.com/shihao/p/2559020.html
Copyright © 2011-2022 走看看