自定义事件 js
// 原理如下
// 创建 类型为HTMLEvents的事件
var evt = document.createEvent("HTMLEvents");
// 初始化 自定义eee 事件
evt.initEvent("eee", false, false);
// 事件绑定
document.addEventListener("eee", function(e) {
console.log(e)
}) // document标签触发事件(直接运行代码触发)
document.dispatchEvent(evt);
二、不使用标签
class EventEmitter {
events = {}
emit(key, ...data) {
if (this.events[key]) {
this.events[key].forEach(it => it(...data))
}
}
on(key, fn) {
if (!this.events[key]) {
this.events[key] = []
}
this.events[key].push(fn)
}
off(key, fn) {
if (!this.events[key]) {
return false
}
if (!fn) {
return (this.events[key] = null)
}
}
}
自定义事件 js的更多相关文章
- jQuery事件命名空间多事件绑定自定义事件js 命名空间 javascript命名空间
http://blog.csdn.net/pigpigpig4587/article/details/24727791 jQuery事件命名空间 jQuery支持事件命名空间,以方便事件管理.例如,在 ...
- 谈谈JS的观察者模式(自定义事件)
呼呼...前不久参加了一个笔试,里面有一到JS编程题,当时看着题目就蒙圈...后来研究了一下,原来就是所谓的观察者模式.就记下来...^_^ 题目 [附加题] 请实现下面的自定义事件 Event 对象 ...
- js自定义事件
自定义事件的本质,创建一个对象,然后把事件的名字作为对象的一个属性,然后value是一个[],把此事件的所以回调都push进去. 写一个很基本的,没有把对象暴露出去的js的自定义事件. var eve ...
- js自定义事件、DOM/伪DOM自定义事件
一.说明.引言 我JS还是比较薄弱的,本文的内容属于边学边想边折腾的碎碎念,可能没什么条理,可能有表述不准确的地方,可能内容比较拗口生僻.如果您时间紧迫,或者JS造诣已深,至此您就可以点击右侧广告(木 ...
- js的自定义事件
js中的事件是js的一大技术点,说白了就是操作dom树的唯一途径. 关于事件无非两种绑定方式: document.getElementById('xxx').onclick = function(){ ...
- 漫谈js自定义事件、DOM/伪DOM自定义事件
一.说明.引言 我JS还是比较薄弱的,本文的内容属于边学边想边折腾的碎碎念,可能没什么条理,可能有表述不准确的地方,可能内容比较拗口生僻.如果您时间紧迫,或者JS造诣已深,至此您就可以点击右侧广告(木 ...
- js 自定义事件 包含 添加、激活、销毁
1.思路 (1)构思 var eventTarget = { addEvent: function(){ //添加事件 }, fireEvent: function(){ //触发事件 }, remo ...
- 使用 JS 关闭警告框及监听自定义事件(amaze ui)
使用 JS 关闭警告框及监听自定义事件(amaze ui) 一.总结 1.jquery匿名函数:第8行,jquery匿名函数,$(function(){});,有没有很简单,只是少了jquery的前面 ...
- Vue.js 源码分析(十四) 基础篇 组件 自定义事件详解
我们在开发组件时有时需要和父组件沟通,此时可以用自定义事件来实现 组件的事件分为自定义事件和原生事件,前者用于子组件给父组件发送消息的,后者用于在组件的根元素上直接监听一个原生事件,区别就是绑定原生事 ...
随机推荐
- Unigui的Grid添加汇总栏
- Java-Runoob-高级教程-实例-数组:05. Java 实例 – 数组输出
ylbtech-Java-Runoob-高级教程-实例-数组:05. Java 实例 – 数组输出 1.返回顶部 1. Java 实例 - 数组输出 Java 实例 以下实例演示了如何通过循环输出数 ...
- ASP.NET Web Pages:目录
ylbtech-.Net-ASP.NET Web Pages:目录 1. 官网返回顶部 1. https://www.asp.net/web-pages 2. https://msdn.microso ...
- 关于ie6下png背景透明
今天我突破了一个技术难关,真的是头都大了.. 关于ie6下png背景透明的解决方法,我就不多说了,网上有很多解决方法,我用的是其中的一种: <script type="text/jav ...
- Shell 定时发送邮件检查网站脚本/邮件正文
#!/bin/bash ############################################################## # File Name: check_http.s ...
- 伯克利、OpenAI等提出基于模型的元策略优化强化学习
基于模型的强化学习方法数据效率高,前景可观.本文提出了一种基于模型的元策略强化学习方法,实践证明,该方法比以前基于模型的方法更能够应对模型缺陷,还能取得与无模型方法相近的性能. 引言 强化学习领域近期 ...
- gz文件最后四位检测
[root@node-0 ~]# ll -rw-r--r-- 1 root root 24048 Nov 29 11:29 install.log 文件大小为24048 [root@node-0 ~ ...
- C# List<string>和ArrayList用指定的分隔符分隔成字符串
原文地址:https://www.cnblogs.com/ahwwmb/p/4166707.html 串联字符串数组的所有元素,其中在每个元素之间使用指定的分隔符 List<string> ...
- 粗解python的@classmethod和@staticmethod及普通实例方法
引言: 使用不同的函数定义方法,可以使得函数定义更加有效而且易于维护 本文为博主原创,根据本人自己的理解整理而成,若有不准确的地方,希望能留言告知以免误导他人: 首先进一段代码,来直观感受一下不同类型 ...
- python 编写远程连接服务器脚本
import paramiko client = paramiko.SSHClient()client.set_missing_host_key_policy(paramiko.AutoAddPoli ...