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 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
随机推荐
- python网络爬虫学习笔记(一)Request库
一.Requests库的基本说明 引入Rquests库的代码如下 import requests 库中支持REQUEST, GET, HEAD, POST, PUT, PATCH, DELETE共7个 ...
- 一、CSS介绍
CSS介绍 1.css概述: CSS指层叠样式表 CSS样式表极大地提高了工作效率 selector{ property:value } 注:property(属性)大于1之后,property之间用 ...
- 保持ssh连接长时间不断开的技巧
我经常用ssh连接服务器,过段时间不用, 需要恢复一下断开的连接, 原因是NAT防火墙喜欢对空闲的会话进行超时处理,以确保它们状态表的干净和内存的低占用率,因为 长时间保持连接, 会长期占用部分系统资 ...
- mazing ASP.NET Core 2.0【转】
前言 ASP.NET Core 的变化和发展速度是飞快的,当你发现你还没有掌握 ASP.NET Core 1.0 的时候, 2.0 已经快要发布了,目前 2.0 处于 Preview 1 版本,意味着 ...
- 微软microsoft word的api文档地址
https://docs.microsoft.com/en-us/previous-versions/office/developer/office-2003/aa172758(v%3doffice. ...
- ABAP 省市县级联搜索帮助
在展示ABAP代码之前,先建立自建表ZCHENH006,表中包含两个关键字段 BELNR(地区编码),SDESC(地区描述). 编码规则参考:身份证前六位地区编码规则,可参考我另外一篇Blog导入系统 ...
- Java JDK 在Windows 10中配置环境变量
首先,去Oracle官方网站下载Java JDK https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-213 ...
- python--第十天总结(Select/Poll/Epoll使用 )
首先列一下,sellect.poll.epoll三者的区别 select select最早于1983年出现在4.2BSD中,它通过一个select()系统调用来监视多个文件描述符的数组,当select ...
- 服务器&linux
linux vsftp查看端口占用:netstat -natp |grep 21如果有占用21端口进程,kill它 ,或者remove它.安装:yum -y install vsftpduseradd ...
- linux用户和组管理,/etc/passwd 、/etc/shadow和/etc/group --学习
一./etc/passwd 和/etc/shadow解释 与用户相关的系统配置文件主要有/etc/passwd 和/etc/shadow,其中/etc/shadow是用户资讯的加密文件,比如用户的密码 ...