创建并触发自定义事件、模拟事件

本文介绍了创建了使用原生JavaScript API创建事件对象并模拟触发事件的方法。


创建自定义事件对象

可以通过Event构造器来创建一个事件对象：

1
var event = new Event('build');

在IE中，虽然有Event这个构造器，但是直接用new来构造会抛出异常，可以使用一个更老的方法，调用document.createEvent来创建一个事件对象并使用e.initEvent来初始化这个事件对象：

1
2
var event = document.createEvent('Event');
event.initEvent('build', true, true);

第二个参数代表bubbles，表示事件是否可冒泡。第三个参数代表cancelable，表示事件是否可被取消（preventDefault）。

触发事件

在事件目标对象（通常是一个HTMLElement）上调用dispatchEvent来触发某个事件，触发的事件由传递的事件对象决定， 比如触发上面自定义好的build事件：

1
2
3
4
var event = document.createEvent('Event');
event.initEvent('build', true, true);
var box = document.getElementById('box');
box.dispatchEvent(event);

也可以通过这个办法来模拟事件的触发，比如模拟mouseenter事件：

1
2
3
4
var event = document.createEvent('MouseEvent');
e.initEvent('mouseenter', true, true);
var box = document.getElementById('box');
box.dispatchEvent(event);
Javascript基础
javascript