技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置：首页 --> JavaScript --> javascript事件触发器fireEvent和dispatchEvent

javascript事件触发器fireEvent和dispatchEvent

浏览:4632次  出处信息

事件触发器就是用来触发某个元素下的某个事件，IE下fireEvent方法，高级浏览器（chrome,firefox等）有dispatchEvent方法。

一般我们在元素上绑定事件后，是靠用户在这些元素上的鼠标行为来捕获或者触发事件的，或者自带的浏览器行为事件，比如click，mouseover，load等等，有些时候我们需要自定义事件或者在特定的情况下需要触发这些事件。这个时候我们可以使用IE下fireEvent方法，高级浏览器（chrome,firefox等）有dispatchEvent方法。

例如在ie下看看这个例子：

01//document上绑定自定义事件ondataavailable
02document.attachEvent('ondataavailable', function (event) {
03alert(event.eventType);
04});
05var obj=document.getElementById("obj");
06//obj元素上绑定click事件
07obj.attachEvent('onclick', function (event) {
08alert(event.eventType);
09});
10//调用document对象的createEventObject方法得到一个event的对象实例。
11var event = document.createEventObject();
12event.eventType = 'message';
13//触发document上绑定的自定义事件ondataavailable
14document.fireEvent('ondataavailable', event);
15//触发obj元素上绑定click事件
16document.getElementById("test").onclick = function () {
17obj.fireEvent('onclick', event);
18};

fireEvent的官方文档：http://msdn.microsoft.com/en-us/library/ms536423(v=vs.85).aspx

createEventObject的官方文档：http://msdn.microsoft.com/en-us/library/ie/ms536390(v=vs.85).aspx

再看看高级浏览器（chrome,firefox等）的例子：

01//document上绑定自定义事件ondataavailable
02document.addEventListener('ondataavailable', function (event) {
03alert(event.eventType);
04}, false);
05var obj = document.getElementById("obj");
06//obj元素上绑定click事件
07obj.addEventListener('click', function (event) {
08alert(event.eventType);
09}, false);
10//调用document对象的 createEvent 方法得到一个event的对象实例。
11var event = document.createEvent('HTMLEvents');
12// initEvent接受3个参数：
13// 事件类型，是否冒泡，是否阻止浏览器的默认行为
14event.initEvent("ondataavailable", true, true);
15event.eventType = 'message';
16//触发document上绑定的自定义事件ondataavailable
17document.dispatchEvent(event);

建议继续学习：

  1. IE的fireEvent方法    (阅读：1429)
QQ技术交流群：445447336，欢迎加入！
扫一扫订阅我的微信号：IT技术博客大学习
<< 前一篇：JavaScript中两个感叹号（!!）的作用
后一篇：jQuery旋转插件—rotate >>
文章信息
建议继续学习
© 2009 - 2024 by blogread.cn 微博：@IT技术博客大学习

京ICP备15002552号-1