js原⽣3种⾃定义事件⽅法（createEvent、
initinitMouseUIEven。。。
⽬录
触发⾃定义事件
dom.dispatchEvent(eventObject)
触发指定dom节点上绑定的eventObject的type名相同的事件。
参数eventObject表⽰事件对象，是createEvent()、Event()、CustomEvent()⽅法返回的创建的Event对象。
创建⾃定义事件⽅法
⽅法⼀（已被W3C标准弃⽤，浏览还⽀持）
通过createEvent函数创建，再通过传⼊的参数对应的⽅法初始化。
创建⼀个指定类型的事件。其返回的对象必须先初始化。⽀持⼀个参数，表⽰事件类型，具体见下表：
参数事件接⼝初始化⽅法
HTMLEvents HTMLEvent initEvent()
MouseEvents MouseEvent initMouseEvent()
UIEvents UIEvent initUIEvent()
dom.initEvent(eventName, canBubble, preventDefault)
初始化createEvent('HTMLEvents')返回的事件。eventName代表⾃定义的事件名，canBubble表⽰是否可以触发冒泡，preventDefault 表⽰是否取消触发默认事件。
dom.initMouseEvent(eventName, canBubble, preventDefault,view,detail, screenX, screenY, clientX,
clientY, ctrlKey, altKey, shiftKey, metaKey,button, relatedTarget)
在⿏标事件创建时初始化其属性的值。初始化createEvent('MouseEvents')返回的事件。前3个参数和
上⾯相同，后⾯参数介绍见下⾯链接：
dom.initUIEvents(eventName, canBubble, preventDefault,view, detail)
在创建 UI 事件后对其进⾏初始化。初始化createEvent('UIEvents')返回的事件。前3个参数和上⾯相同，view是与事件相关联的，detail 是unsigned long  指定有关事件的⼀些详细信息，具体取决于事件的类型。对于⿏标事件，它表⽰⿏标在给定的屏幕位置上被点击了多少次。
实例
//选择dom节点
var dom = ElementById('')
//dom节点上绑定⾃定义事件abc
dom.addEventListener('abc', function (event) {
console.log(event)
}, false);
// 创建事件
var evt = ateEvent("UIEvents");
// 初始化事件为⾃定abc事件
evt.initUIEvent("abc", false, false);
// 触发事件
dom.dispatchEvent(evt);
触发结果如下图：
⾃定义事件名对应type，bubbles对应是否可以冒泡，defaultPrevented对应是否可以触发默认事件。
⽅法⼆
Event(eventName,eventInit)
创建⼀个新的对象。以这种⽅式创建的事件称为合成事件，与浏览器触发的事件相反，并且可以由脚本。
js方法参数：typeArg表⽰事件名称的字符串，eventInit 为⼀个具有以下可选字段的对象：
bubbles 可选，指⽰事件是否冒泡的布尔值，默认值为 false。
cancelable 可选，⼀个布尔值，指⽰是否取消默认事件，默认值为false。
composed 可选，⼀个布尔值，指⽰事件是否会触发影⼦根之外的侦听器（有关更多详细信息，请参见），默认值为false。实例
var evt = new Event("look", {"bubbles":true, "cancelable":false});
var dom = document
dom.addEventListener('look', function (event) {
console.log(event)
}, false);
document.dispatchEvent(evt);
触发结果如下图：
⽅法三
CustomEvent(eventName,eventInit)
创建⼀个新的 对象。
参数：typeArg表⽰事件名称的字符串，eventInit 为⼀个具有以下可选字段的对象：bubbles 可选，指
⽰事件是否冒泡的布尔值，默认值为 false。
cancelable 可选，⼀个布尔值，指⽰是否取消默认事件，默认值为false。
detail 可选，默认为null，属于 any 类型，这是与事件关联的事件相关值。
实例
var evt =new CustomEvent("cat", {"detail":{"hazcheeseburger":true}});
var dom = document
dom.addEventListener('cat', function (event) {
console.log(event)
}, false);
dom.dispatchEvent(evt);
触发结果如下图：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。