JS自定义事件（Dom3级事件下）

原文出处：  http://www.w3cfuns.com/notes/11861/e21736a0b15bceca0dc7f76d77c2fb5a.html 。 我拿出作者中的一段，感谢作者原创。

 

DOM中的事件模拟（自定义事件）：

　　DOM3级还定义了自定义事件，自定义事件不是由DOM原生触发的，它的目的是让开发人员创建自己的事件。要创建的自定义事件可以由createEvent("CustomEvent"); 返回的对象有一个initCustomEvent（）方法接收如下四个参数。
　　1）type：字符串，触发的事件类型，自定义。例如 “keyDown”，“selectedChange”;
　　2）bubble（布尔值）：标示事件是否应该冒泡；
　　3）cancelable(布尔值)：标示事件是否可以取消；
　　4）detail（对象）：任意值，保存在event对象的detail属性中；

可以像分配其他事件一样在DOM中分派创建的自定义事件对象。如：

   
　　var  div = document.getElementById("myDiv");
　　EventUtil.addEventHandler(div,"myEvent", function () {
　　　　alert("div myEvent!");
　　});
　　EventUtil.addEventHandler(document,"myEvent",function(){
　　　　alert("document myEvent!");
　　});
　　if(document.implementation.hasFeature("CustomEvents","3.0")){
　　　　var e = document.createEvent("CustomEvent");
　　　　e.initCustomEvent("myEvent",true,false,"hello world!");
　　　　div.dispatchEvent(e);
　　}
　　这个例子中创建了一个冒泡事件“myEvent”。而event.detail的值被设置成了一个简单的字符串，然后在div和document上侦听该事件，因为在initCustomEvent中设置了事件冒泡。所以当div激发该事件时，浏览器会将该事件冒泡到document。
　　IE中的事件模拟(IE8及之前版本中)：
　　与DOM中事件模拟的思路类似，先创建event对象，再为其指定相应信息，然后再使用该对象来触发事件。当然IE在实现以下每个步骤都不太一样。
　　例如：
　　var btn = document.getElementById("myBtn");
　　//创建事件对象,不接受任何参数，结果会返回一个通用的event对象，你必须为该event对象指定所有必要的信息。
　　var event  = document.createEventObject();
　　//初始化事件对象
　　event.screenX = 100；
　　event.screenY = 0;
　　event.clientX = 0;
　　event.clientY =0;
　　event.ctrlKey = false;
　　event.altKey = false;
　　event.shiftKey = false;
　　event.button = 0;

　　//触发事件
　　btn.fireEvent("onclick",event);