JavaScript--自定义事件Event
在开发过程中,js原生事件不足以满意开发需求,需要开发者自定义事件。
一、Event
Event()构造函数创建一个新的Event。
event = new Event(typeArg,eventInit);
typeArg
事件名称。
eventInit
这是一个对象,包含以下字段:
例
var _event = new Event('eventName', {"bubbles":true, "cancelable":false}); //dispatchEvent派发事件
document.dispatchEvent(_event); myDom.dispatchEvent(evt);
二、事件逻辑
自定义的事件可以绑定到DOM元素上定义事件处理逻辑,然后通过dispatchEvent派发事件。
例
var _event = new Event('look', {"bubbles":true, "cancelable":false}); document.addEventListener('look', function(){
console.log('lootEvent_document');
}); myDom.addEventListener('look', function(){
console.log('lootEvent_myDom');
}); myDom.dispatchEvent(_event); //lootEvent_myDom lootEvent_document document.dispatchEvent(_event); //lootEvent_document
因为我们定义的事件是冒泡的,所以在myDom上触发look事件会冒泡到document上去。
JavaScript--自定义事件Event的更多相关文章
- javascript 自定义事件 发布-订阅 模式 Event
* javascript自定义事件 var myEvent = document.createEvent("Event"); myEvent.initEvent("myE ...
- Javascript事件模型系列(四)我所理解的javascript自定义事件
被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情,公司的个人的,搞的自己心烦意乱浮躁了一 ...
- 理解的javascript自定义事件
理解的javascript自定义事件 被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情, ...
- Javascript自定义事件功能与用法实例分析
原文地址:https://www.jb51.net/article/127776.htm 本文实例讲述了javascript自定义事件功能与用法.分享给大家供大家参考,具体如下: 概述 自定义事件很难 ...
- javascript:自定义事件初探
javascript:自定义事件初探 http://www.cnblogs.com/jeffwongishandsome/archive/2008/10/27/1317148.html
- Javascript 自定义事件 (custom event)
Javascript 中经常会用到自定义事件.如何创建一个简单的自定义事件呢?在创建自定义的事件之前,我们应该考虑一下和事件有关的东西.例如 click 事件,首先我们要能注册一个click事件(在一 ...
- JavaScript自定义事件
很多DOM对象都有原生的事件支持,向div就有click.mouseover等事件,事件机制可以为类的设计带来很大的灵活性,相信.net程序员深有体会.随着web技术发展,使用JavaScript自定 ...
- 自定义事件——Event和CustomEvent
之前在学习自定义事件时,在MDN的Event.initEvent()页面顶端有写:该特性已从Web标准中删除,虽然一些浏览器目前仍然支持它,但也许会在未来的某个时间停止支持,请尽量不要使用该特性. 作 ...
- JavaScript自定义事件 - createEvent()、initEvent()和dispachEvent()
在学习目标事件的方法的时候,接触到了dispatchEvent()方法.度娘查一查,这是一个事件触发器,事件触发器其实就是触发事件的东西. 通常情况下,我们触发事件都是在交互中触发的事件,例如点击按钮 ...
- 高级功能:很有用的javascript自定义事件
之前写了篇文章<原生javascript实现类似jquery on方法的行为监听>比较浅显,能够简单的使用场景. 这里的自定义事件指的是区别javascript默认的与DOM交互的事件,比 ...
随机推荐
- windows + Eclipse 汉化
https://www.eclipse.org/babel/downloads.php 下载Eclipse 对应版本 汉化包解压 复制文件夹里的内容到eclipse 文件夹下对应的文件里 重启ecli ...
- JS权威指南读书笔记(二)
第四章 表达式和运算符 1 new调用构造函数的过程 a 创建一个新的空对象 b 设置空对象的_proto_指向构造函数原型prototype c 将这个新对象当做this的值 ...
- 记一次渗透某XX站
0X00 前言 团队A师傅发来个站,问我有没有得搞 正好在搞其他的站,卡住了,开干换个思路. 0x01 信息收集 开burp抓了下包,目标设置了url重写,开了报错,我们随意输入一个控制器就直接报错. ...
- 【转载】2018年最值得期待的5大BPM厂商
部署BPM软件可以帮助企业获得竞争优势,通过分析.设计.执行.控制和调节业务流程协助企业领导者提高组织绩效. 业务流程管理(BPM)是指随着公司和组织的发展匹配业务目标和流程的行为.部署BPM软件可以 ...
- Jlink调试S5PV210
安装CDT C/C++ Development Toolkit,使eclipse可以开发C/C++项目 Help–>Install New Software中输入:http://download ...
- MySQL索引机制详解(B+树)
一.索引是什么? 索引是为了加速对表中数据行的检索而创建的一种分散存储的数据结构. 二.为什么要使用索引? 索引能极大的减少存储引擎需要扫描的数据量. 索引可以把随机IO变成顺序IO. 索引可以帮助我 ...
- Hadoop读写mysql
需求 两张表,一张click表记录某广告某一天的点击量,另一张total_click表记录某广告的总点击量 建表 CREATE TABLE `click` ( `id` ) NOT NULL AUTO ...
- Oracle基础知识【1】
目录: 1.Oracle创建库.表 2.Oracle数据怎删查改操作 3.Oracle数据约束条件 Oracle创建库.表: create user user05 identified by 1234 ...
- 男上加男团队对 修!咻咻! 团队,云打印 团队的Beta产品测试报告
男上加男团队对 修!咻咻! 团队的Beta产品测试报告 男上加男团队对云打印 团队的Beta产品测试报告 6.2 1.57分补充 睡觉前看终于看到发布的在线版本 重新测试了一下 卡在注册这关 无法收到 ...
- 【Java】用五种语言写数组(用于自己学习)
C语言 #include<stdio.h> int main() { ] = {, , , , , , , , , }; int i; ;i<;i++) printf("% ...