【其实就是自动触发事件,而非手动(交互)触发事件】

dispatchEvent是作为高级浏览器(如chrome、Firfox等)的事件触发器来使用的,那么什么是事件触发器?就是触发事件的东西。可能有人觉得有点莫名其妙,触发事件不是在交互中被触发的吗?的确,通常情况下,事件的触发都是由用户的行为如点击、刷新等操作实现,但是,其实有的情况下,事件的触发必须由程序来实现,比如ajax框架的一些自定义事件。正如事件的绑定一样,对于浏览器而言,绑定事件分为高级浏览器和IE浏览器两派,事件触发器也是分为高级浏览器和IE两派,而dispatchEvent正是用于高级浏览器的事件触发。下面看我整理的一个触发事件的例子:

  1. <!--
  2. Author: lJian
  3. -->
  4. <!DOCTYPE html>
  5. <html>
  6. <head lang="en">
  7. <meta charset="UTF-8">
  8. <title></title>
  9. </head>
  10. <body>
  11. </body>
  12. <script type="text/javascript">
  13. //document上绑定自定义事件oneating
  14. document.addEventListener('eat', function (event) {
  15. alert(event.mingzi+','+event.message);
  16. }, false);
  17. //创建event的对象实例。
  18. var event = document.createEvent('HTMLEvents');
  19. // 3个参数:事件类型,是否冒泡,是否阻止浏览器的默认行为
  20. event.initEvent("eat", true, true);
  21. /*属性,随便自己定义*/
  22. event.mingzi = 'hello,我是李小贱';
  23. event.message = '我今天24岁';
  24. //触发自定义事件oneating
  25. document.dispatchEvent(event);
  26. </script>
  27. </html>

dispatchEvent大概就是这三步,上面的例子结果是:在页面载入的时候,会弹出提示框,也就是触发了oneating这个自定义事件。下面看看据说来自司徒正美的一段代码:

  1. var fireEvent = function(element,event){
  2. if (document.createEventObject){
  3. // IE浏览器支持fireEvent方法
  4. var evt = document.createEventObject();
  5. return element.fireEvent('on'+event,evt)
  6. }
  7. else{
  8. // 其他标准浏览器使用dispatchEvent方法
  9. var evt = document.createEvent( 'HTMLEvents' );
  10. evt.initEvent(event, true, true);
  11. return !element.dispatchEvent(evt);
  12. }
  13. };
document.creatEventObject()是IE创建event对象实例的方法,和document.creatEvent('HTMLEvents')在非IE主流浏览器下的作用相同,fireEvent是IE下的事件触发器,与dispatchEvent在非IE主流浏览器下作用相同。

js事件触发器 dispatchEvent()的更多相关文章

  1. js事件触发器fireEvent和dispatchEvent

    转自:https://www.cnblogs.com/tiger95/p/6962059.html 事件触发器就是用来触发某个元素下的某个事件,IE下fireEvent方法,高级浏览器(chrome, ...

  2. 事件触发器-----dispatchEvent

    不要被标题蒙蔽了,今天的重点不是论述事件触发器,而是说一下dispatchEvent这个东西.好了,先简单做个铺垫,dispatchEvent是作为高级浏览器(如chrome.Firfox等)的事件触 ...

  3. javascript事件触发器fireEvent和dispatchEvent

    javascript事件触发器fireEvent和dispatchEvent   事件触发器就是用来触发某个元素下的某个事件,IE下fireEvent方法,高级浏览器(chrome,firefox等) ...

  4. Node.js精进(4)——事件触发器

    Events 是 Node.js 中最重要的核心模块之一,很多模块都是依赖其创建的,例如上一节分析的流,文件.网络等模块. 比较知名的 Express.KOA 等框架在其内部也使用了 Events 模 ...

  5. js事件相关面试题

    说是面试题,其实也相当于是对js事件部分知识点的一个总结.简单内容一笔带过,了解详情我都给出了参考链接,都是之前写的一些相关文章.JavaScript本身没有事件模型,但是环境可以有. DOM:add ...

  6. js事件浅析

    js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...

  7. Javascript事件派发-dispatchEvent

    事件派发的作用: 1.派发数据,将一个封闭模块中的数据传递给另一个封闭模块.2.事件完成了较为复杂的解耦. 事件和回调函数不同在于: 1.事件可以在任意地方去获取,而回调函数只能在一个地方存在,如果需 ...

  8. Js 事件基础

    一:js中常见得事件 (1) : 鼠标事件         click :点击事件         dblclick :双击事件         contextmenu : 右键单击事件        ...

  9. dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来

    dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...

随机推荐

  1. percona-toolkit(pt-online-schema-change)工具包的安装和使用

    1.下载和安装percona toolkit的包 #yum install http://www.percona.com/downloads/percona-release/redhat/0.1-4/ ...

  2. CentOS安装mysql源码包

    1.# cd /usr/local/src 2.上传mysql.tar.gz文件 3.# tar -zxvf mysql-5.6.36-linux-glibc2.5-x86_64.tar.gz 4.# ...

  3. (转)SQLServer查询数据库各种历史记录

    原文地址https://www.cnblogs.com/seusoftware/p/4826958.html 在SQL Server数据库中,从登陆开始,然后做了什么操作,以及数据库里发生了什么,大多 ...

  4. python常见用法

    1.冒泡排序 a = [25,15,47,36,44,455,67,234,7,8,-47] def sortport(): for i in range(len(a)-1): for j in ra ...

  5. python——vs2017安装python库时,提示pip指令问题。

    需要跟新pip指令 方法: 第一步:打开vs2017 后新建一个python 文件 后面如图 点击红色部分 2.在框中输入pip之后更新即可 如图 3.问题解决 倘若还有问题 欢迎分享

  6. [PAClient Error] Error: E4356 File does not exist armv7

    [PAClient Error] Error: E4356 File does not exist: /Users/tt/PAServer/scratch-dir/Administrator-snIO ...

  7. python中的新式类与旧式类

    在python2中,有新式类与旧式类的区别: 首先创建一个类: class Sb(object): pass 如果创建时继承自object,说明这是一个新式类,不写object,说明是一个旧式类: 那 ...

  8. springmvc controller方法返回值

  9. ubuntu 从零安装tf-serving环境和opencv

    参考官网:https://www.tensorflow.org/serving/setup 首先是安装gprc: pip install grpcio 然后发现没有安装pip,报错:sudo: pip ...

  10. Codeforces Round #436 A. Fair Game

    题意:给你n张卡片,上面写有数字,两个人选择两个数字,把相同数字的卡片都拿走,问能不能拿走所有的卡片并且两个人拿的卡片书相同. Examples Input 411272711 Output YES1 ...