Ruby's Louvre

The Crankiness of Belief achieves Great , not the Trick of Regulation.

IE的window.event实例

今天在QQ群里有人提到一个奇怪问题,是有关IE的事件对象有时候不等于自身的,见下面代码(注意,本文的所有例子请在IE下执行):

 
<button id='ss' onclick="xx(window.event)">Click</button>
    <script type="text/javascript">
      alert(window.event==window.event);  //true

      (function(){
        alert(window.event==window.event);//true
      })();

      function xx(e){
        alert(e==window.event);//false
        alert(window.event==window.event);//false
      }
    </script>

当我们点击按钮后,发现弹出的是两个false。很明显这是两个不同的对象。可以通过以下实验证明:

 
 <button id='ss'type="button"  
    onclick="var a = window.event; a.aaa = '司徒正美';xx(a)">Click</button>
    <script type="text/javascript">
      function xx(e){
        alert(e.aaa)//司徒正美
        alert(window.event.aaa)//undefined
        alert(e==window.event);//false
        alert(window.event==window.event);//false
      }
    </script>

知道这个后,我们要探讨的是什么情况下才产生一个新的实例。经过仔细观察,如果直接放到全局作用域下,或自动执行函数中,比较的两个window.event是相同的。一旦执行事件了,就有新的实例生成了,并且是一个window.event对应一个新实例。换言之,出现两次window.event就有两个不同的事件实例,这样推断就可以解析上面的现象了。我们可以通过以下实验证明一下:

 
 <button id='ss'type="button" onclick="xx()">Click</button>
    <script type="text/javascript">
      function xx(e){
        var a = window.event;//生成一个新实例,
        a.id = "司徒正美";
        var b = window.event;
        b.id = "ruby louvre";
        var c = window.event;
        c.id = "しとうなさみ"
        alert(a.id);//司徒正美
        alert(b.id);//ruby louvre
        alert(c.id);//"しとうなさみ"
        alert(a === b)//false
        alert(a === c)//false
      }
    </script>

因此,我们基本上可以说window.event是一个不能用new的构造器,而不单单是一个普通的全局变量,它只会在我们触发了具体事件(onclick,onclick,onload……)中才会生成新的实例。其他情形改来改去只是对一个window.event实例进行操作,另,window.event在DOM树未完成前甚至不存在的!

 
      function xx(){
        var a = window.event;
        alert(a);
      }
      xx();//这时DOM树还没有完成
      window.onload = function(){
        xx();
      }

标签: javascript

posted on 2010-03-18 19:02 司徒正美 阅读(1847) 评论(7) 编辑 收藏

评论

#1楼 2010-03-18 20:51 MyCoolDog      

学习了!谢谢!  回复 引用 查看   

#2楼 2010-03-18 23:03 fang_regal      

不错不错  回复 引用 查看   

#3楼 2010-03-19 09:14 jowo      

怎么我在Google浏览器运行的和你相反,google浏览器上第1个例子弹出的是两个true  回复 引用 查看   

#4楼 2010-03-19 09:20 蓝野      

我用的是FF浏览器,运行第一个例子也是两个true  回复 引用 查看   

#5楼[楼主] 2010-03-19 13:54 司徒正美      

上面两位的眼睛没问题吧,都说IE的……
 回复 引用 查看   

#6楼 2010-03-19 16:43 jowo      

老大,即使在IE你的也是错误的,我在IE6测试就是二个true ,第一个例子  回复 引用 查看   

#7楼[楼主] 2010-03-19 17:11 司徒正美      

@jowo
看了代码没有,一开始是两个true,再点button是两个false
 回复 引用 查看