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 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
随机推荐
- 1、ZooKeeper 基本概念、使用方法、实践场景
ZooKeeper 基本概念 ZooKeeper 是面向分布式应用的协调服务,其实现了树形结构的数据模型(与文件系统类似),并且提供了简洁的编程原语.ZooKeeper 能够作为基础,用于构建更高层级 ...
- Gitlab CI 持续集成的完整实践
Gitlab CI 持续集成的完整实践 本着公司团队初创,又在空档期想搞点事情,搭建了私有Gitlab的契机,顺便把持续集成搭建起,实现了对Python服务端代码的单元测试.静态代码分析和接口测试的持 ...
- Git从远程clone项目报错cannot open git-upload-pack，将http.sslVerify设为false即可
通过HTTPS访问Git远程仓库,如果服务器的SSL证书未经过第三方机构签署,那么Git就会报错 通过https访问Git远程仓库,如果服务器的SSL证书没有经过第三方机构签署,就会出现cannot ...
- java 中文繁简体转换工具 opencc4j
创作缘由 对于中文的繁简体转换是一种很常见的需求. 但是很多工具类都是简单的做个映射.(使用map,集合,properties)等. 存在一个严重的问题:特殊词组 的转换可能存在问题. OpenCC ...
- TensorFlow模型加载与保存
我们经常遇到训练时间很长,使用起来就是Weight和Bias.那么如何将训练和测试分开操作呢? TF给出了模型的加载与保存操作,看了网上都是很简单的使用了一下,这里给出一个神经网络的小程序去测试. 本 ...
- ORACLE在IMP时候出现数据丢失
IMP-00019: 由于 ORACLE 错误 12899 而拒绝行 IMP-00003: 遇到 ORACLE 错误 12899 ORA-12899: 列 "JACKEYJ".&q ...
- django之 基于queryset和双下划线的跨表查询
前面篇随笔写的是基于对象的跨表查询:对象.objects.filter(...) 对象.关联对象_set.all(...) -->反向 基于对象的跨表查询例如: book_obj= Book ...
- Android 开发 框架系列 Android-Universal-Image-Loader 图片加载使用demo
Android-Universal-Image-Loader github地址:https://github.com/nostra13/Android-Universal-Image-Loader 加 ...
- win10 linux 子系统 所在 目录
C:\Users\用户名\AppData\Local\Packages\CanonicalGroupLimited.UbuntuonWindows_79rhkp1fndgsc\LocalState\r ...
- 59.纯 CSS 创作彩虹背景文字
原文地址:https://segmentfault.com/a/1190000015352436 修改后地址:https://scrimba.com/c/cqK3LaTQ 感想: 又一次见识到CSS的 ...