js事件触发器 dispatchEvent()
【其实就是自动触发事件，而非手动(交互)触发事件】
dispatchEvent是作为高级浏览器(如chrome、Firfox等)的事件触发器来使用的，那么什么是事件触发器？就是触发事件的东西。可能有人觉得有点莫名其妙，触发事件不是在交互中被触发的吗？的确，通常情况下，事件的触发都是由用户的行为如点击、刷新等操作实现，但是，其实有的情况下，事件的触发必须由程序来实现，比如ajax框架的一些自定义事件。正如事件的绑定一样，对于浏览器而言，绑定事件分为高级浏览器和IE浏览器两派，事件触发器也是分为高级浏览器和IE两派，而dispatchEvent正是用于高级浏览器的事件触发。下面看我整理的一个触发事件的例子：
- <!--
- Author: lJian
- -->
- <!DOCTYPE html>
- <html>
- <head lang="en">
- <meta charset="UTF-8">
- <title></title>
- </head>
- <body>
- </body>
- <script type="text/javascript">
- //document上绑定自定义事件oneating
- document.addEventListener('eat', function (event) {
- alert(event.mingzi+'，'+event.message);
- }, false);
- //创建event的对象实例。
- var event = document.createEvent('HTMLEvents');
- // 3个参数：事件类型，是否冒泡，是否阻止浏览器的默认行为
- event.initEvent("eat", true, true);
- /*属性，随便自己定义*/
- event.mingzi = 'hello,我是李小贱';
- event.message = '我今天24岁';
- //触发自定义事件oneating
- document.dispatchEvent(event);
- </script>
- </html>
dispatchEvent大概就是这三步，上面的例子结果是：在页面载入的时候，会弹出提示框，也就是触发了oneating这个自定义事件。下面看看据说来自司徒正美的一段代码：
- var fireEvent = function(element,event){
- if (document.createEventObject){
- // IE浏览器支持fireEvent方法
- var evt = document.createEventObject();
- return element.fireEvent('on'+event,evt)
- }
- else{
- // 其他标准浏览器使用dispatchEvent方法
- var evt = document.createEvent( 'HTMLEvents' );
- evt.initEvent(event, true, true);
- return !element.dispatchEvent(evt);
- }
- };
js事件触发器 dispatchEvent()的更多相关文章
- js事件触发器fireEvent和dispatchEvent
转自:https://www.cnblogs.com/tiger95/p/6962059.html 事件触发器就是用来触发某个元素下的某个事件,IE下fireEvent方法,高级浏览器(chrome, ...
- 事件触发器-----dispatchEvent
不要被标题蒙蔽了,今天的重点不是论述事件触发器,而是说一下dispatchEvent这个东西.好了,先简单做个铺垫,dispatchEvent是作为高级浏览器(如chrome.Firfox等)的事件触 ...
- javascript事件触发器fireEvent和dispatchEvent
javascript事件触发器fireEvent和dispatchEvent 事件触发器就是用来触发某个元素下的某个事件,IE下fireEvent方法,高级浏览器(chrome,firefox等) ...
- Node.js精进（4）——事件触发器
Events 是 Node.js 中最重要的核心模块之一,很多模块都是依赖其创建的,例如上一节分析的流,文件.网络等模块. 比较知名的 Express.KOA 等框架在其内部也使用了 Events 模 ...
- js事件相关面试题
说是面试题,其实也相当于是对js事件部分知识点的一个总结.简单内容一笔带过,了解详情我都给出了参考链接,都是之前写的一些相关文章.JavaScript本身没有事件模型,但是环境可以有. DOM:add ...
- js事件浅析
js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...
- Javascript事件派发-dispatchEvent
事件派发的作用: 1.派发数据,将一个封闭模块中的数据传递给另一个封闭模块.2.事件完成了较为复杂的解耦. 事件和回调函数不同在于: 1.事件可以在任意地方去获取,而回调函数只能在一个地方存在,如果需 ...
- Js 事件基础
一:js中常见得事件 (1) : 鼠标事件 click :点击事件 dblclick :双击事件 contextmenu : 右键单击事件 ...
- dynamic-css 动态 CSS 库，使得你可以借助 MVVM 模式动态生成和更新 css，从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
随机推荐
- 涂抹mysql笔记-安装mysql
1.mysql安装:(1)RPM安装:rpm -ivh xxx 建议安装三个:MySQL-server-VERSION.PLATFORM-cpu.rpmMySQL-client-VERSION.PLA ...
- Chrome默认搜索引擎被窜改
折腾了几个安全软件之后,Chrome浏览器默认搜索引擎被窜改,且无法删除,提示“管理员安装”,另外在插件栏出现了一个unTabs的东西,也无法删除,“受政策保护之类的”.搜索后找到一篇文章“Unabl ...
- 通过eclipse打开jdk native源码
1.下载 eclipse http://www.eclipse.org/downloads/eclipse-packages/ 建议下载 Eclipse IDE for Eclipse Committ ...
- html 设置input框的记忆功能(联想内容)
autocomplete＝“on/off” 1．默认情况下,autocomplete的值是on.你可以将其设置为off. 2．autocomplete属性可以放在input 元素上,也可以放在form ...
- 装饰器,栈 ,asyncio 代码
装饰器目的: 不改变原来代码的基础上. 给函数添加新功能动态代理. 拦截器 通用装饰器的写法def wrapper(fn): def inner(*args, **kwargs): '''之前''' ...
- Windows下文件加固
今天学到一种Windows下简单的文件加固方法,可以防止文件被(普通)删除. CMD找到要加固的文件. 例:C盘下有个 1516.txt 文本文件需要加固. 然后 copy 该文件.(注意:这里并非普 ...
- Android 开发 深入理解Handler、Looper、Messagequeue 转载
转载请注明出处:http://blog.csdn.net/vnanyesheshou/article/details/73484527 本文已授权微信公众号 fanfan程序媛 独家发布 扫一扫文章底 ...
- How can I manage the modules for python2 when python3 installed as well. In OSX
ref: https://stackoverflow.com/questions/53385448/how-can-i-manage-the-modules-for-python2-when-pyth ...
- C#设计模式(2)——简单工厂模式（Factory ）
我们通过 Factory 创建对象不同的对象. 例如:如果创建一个汽车的接口,通过 工厂Factory 创建实现接口的对象,根据我们的选择来创建不同的对象. 创建汽车接口 /// <summar ...
- Python 进行查询日志查询条件分析
任务:crm日志的查询条件 每次是哪几个字段查,有几种组合 ,统计每种组合查询的量 日志样例: -- ::] -- ::] 查询条件:query查询条件可以多个,用|and|分割. 步骤: 1.正则 ...