JavaScript事件解析

(1). 创造

var event = document.createEvent(type);
type:是一个字符串，表示要创建的事件类型。事件类型可能包括是一个字符串，表示要创建的事件类型。
事件类型可能包括"UIEvents", "MouseEvents", "MutationEvents", 或者 "HTMLEvents"

(2) 初始化

event.initEvent('build', true, true);
于初始化通过DocumentEvent接口创建的Event的值。支持三个参数：initEvent(eventName, canBubble,preventDefault)
分别表示事件名称，是否可以冒泡，是否阻止事件的默认操作

(3). 触发

elem.dispatchEvent(event);
参数event表示事件对象，是createEvent()方法返回的创建的Event对象

监听方法

elem.addEventListener('build', function (e) {
// e.target matches elem
}, false);

(1). trigger()

常用模拟
 模拟方法操作
 $("#btn").trigger("click");
 或者 
 $("#btn").click();

自定义事件
 $("#btn").on("myClick", function () {
 $("#test").append("<p>我的自定义事件。</p>")；
 })； 
 $("btn").trigger("myClick");

传递数据
 trigger(tpye[,datea])；
 第一个参数是要触发的事件类型，
 第二个单数是要传递给事件处理函数的附加数据，以数组形式传递。
 通常可以通过传递一个参数给回调函数来区别这次事件是代码触发的还是用户触发的
 $("#btn").bind("clickCustomize", function (event, message1, message2) { //获取数据
 $("#test").append("p" + message1 + message2 + "</p>");
 });
 $("#btn").trigger("clickCustomize",["我的自定义","事件"]); //传递两个数据
 $(“#btn”).trigger(“clickCustomize”,["我的自定义","事件"]); //传递两个数据

(2). triggerHandler();(阻止默认事件)

triggerHandler("lickCustomize");

(1)、优势：

1、自定义事件完全由我们控制触发时机，这就意味着实现了一种 JavaScript 的解耦。我们可以把多个关联但逻辑复杂的操作利用自定义事件的机制灵活地控制好
2、既然绑定也可以解绑，如果不需要了，直接移除绑定事件

(2)、劣势

1、兼容性差，要自己hack(jq除外)