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交互的事件,比 ...
随机推荐
- Linux下OpenSSL加密解密压缩文件(AES加密压缩文件)
OpenSSL是一个开源的用以实现SSL协议的产品,它主要包括了三个部分:密码算法库.应用程序.SSL协议库.Openssl实现了SSL协议所需要的大多数算法.下面介绍使用Openssl进行文件的对称 ...
- 基于NetCore+SqlSugar+Layui开发出来的开源框架项目FytSoaCms问题处理
最近刚好在学习NetCore框架所以就在网上搜索了一下相关的开源框架项目,正好在Github上找到了一个不错的开源框架所以推荐给大家看看哈哈哈. 1:项目相关技术 运行NetCore SDK版本为2. ...
- nginx 之 https 证书配置
HTTPS原理和作用 为什么需要HTTPS 原因:HTTP不安全 传输数据被中间人盗用.信息泄露 数据内容劫持.篡改 HTTPS协议的实现 对传输内容进行加密以及身份验证 对称加密:加密秘钥和解密秘钥 ...
- javascript_13-函数是一种数据类型
函数是一种数据类型 函数是一种数据类型 function var num =60; // 1 函数是一种数据类型 function var myFun = function(){ console.lo ...
- MySQL常见interview
mysql支持的存储引擎,以及各自区别 常用的有myisam,innodb,bdb myisam是mysql默认存储引擎:不支持事务和外键,访问速度快,对事物完整性没有要求或者以select.inse ...
- SQL注入是什么?如何防止?
SQL注入是什么?如何防止? SQL注入是一种注入攻击,可以执行恶意SQL语句.下面本篇文章就来带大家了解一下SQL注入,简单介绍一下防止SQL注入攻击的方法,希望对大家有所帮助. 什么是SQL注入? ...
- unittest 运行slenium(四)---通过指定用例的形式运行用例
一: 说明 跟数据驱动唯一的区别为用例数据获取时,及运行方式不同. 其它都基本相同,可参考https://www.cnblogs.com/xiaodingdong/p/11753220.html 二: ...
- Bash基础——Shell脚本内部常用环境变量
$@和$*区别 不加引号的时候没区别 #! /usr/bin/bash function print_args_at { printf "%s\n" $@ echo $@ } fu ...
- python_ joinablequeue详解
2019-5-20未命名文件 新建模板小书匠 欢迎使用 小书匠(xiaoshujiang)编辑器,您可以通过 小书匠主按钮>模板 里的模板管理来改变新建文章的内容. joinablequeue实 ...
- VISION控制器标定及网络分析工具
VISION 标定和数据采集软件是一个强大的集成工具包,各个工具包可以无缝组合在一起,提供集成的可定制的应用程序,从而能够实现完整的标定和数据分析功能,包括从电子控制单元及外部源收集数据,测量输入和输 ...