通过Event和dispathEvents触发自定义事件

    <span id="btn">获取</span>
<script>
var event = new Event("build");
var ele = document.getElementById("btn"); ele.addEventListener("build", function(){
alert("build")
}, false) ele.dispatchEvent(event)
</script>

还可以通过CustomEvent 高度自定义事件,传输参数。

    <span id="btn">获取</span>
<script>
var event = new CustomEvent("build", {
detail: {
data: new Date().getDate()
},
bubbles: true, //是否冒泡
cancelable: false //是否取消默认事件
}); var ele = document.getElementById("btn"); ele.addEventListener("build", function(e){
console.log("今天是" + e.detail.data + "日")
}, false) ele.dispatchEvent(event); // 触发事件
</script>

自定义事件 Event 、CustomEvent的使用的更多相关文章

  1. 自定义事件——Event和CustomEvent

    之前在学习自定义事件时,在MDN的Event.initEvent()页面顶端有写:该特性已从Web标准中删除,虽然一些浏览器目前仍然支持它,但也许会在未来的某个时间停止支持,请尽量不要使用该特性. 作 ...

  2. 转 js自定义事件——Event和CustomEvent

    之前在学习自定义事件时,在MDN的Event.initEvent()页面顶端有写:该特性已从Web标准中删除,虽然一些浏览器目前仍然支持它,但也许会在未来的某个时间停止支持,请尽量不要使用该特性. 作 ...

  3. Javascript事件模型系列(四)我所理解的javascript自定义事件

    被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情,公司的个人的,搞的自己心烦意乱浮躁了一 ...

  4. 如何订阅Form的自定义事件

    Window Form类有很多的属性/方法和事件,其中事件属于一种发布订阅模式 .订阅发布模式定义了一种一对多的依赖关系,让多个订阅者对象同时监听某一个主体对象.这个主体对象在自身状态变化时,会通知所 ...

  5. 理解的javascript自定义事件

    理解的javascript自定义事件 被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情, ...

  6. 谈谈JS的观察者模式(自定义事件)

    呼呼...前不久参加了一个笔试,里面有一到JS编程题,当时看着题目就蒙圈...后来研究了一下,原来就是所谓的观察者模式.就记下来...^_^ 题目 [附加题] 请实现下面的自定义事件 Event 对象 ...

  7. js:实现自定义事件对象接口

    网易2017内推笔试题 要求: 请实现下面的自定义事件Event对象的接口,功能见注释(测试1) 该Event对象的接口需要能被其他对象拓展复用(测试2) //测试1 Event.on('test', ...

  8. Qt 自定义事件(三种方法:继承QEvent,然后Send Post就都可以了,也可以覆盖customEvent函数,也可覆盖event()函数)

    Qt 自定义事件很简单,同其它类库的使用很相似,都是要继承一个类进行扩展.在 Qt 中,你需要继承的类是 QEvent. 继承QEvent类,你需要提供一个QEvent::Type类型的参数,作为自定 ...

  9. js自定义事件CustomEvent、Event、TargetEvent

    1.Event Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件通常与函数结合使用,函数不会在事件发生前被执行! Event的事件都是系统自 ...

随机推荐

  1. OpenWrt下如何配置网络?

    答: 使用uci进行配置,示例如下: uci get network.wan.ifname (笔者得到eth1) uci set network.wan.ifname=ethx (如: uci set ...

  2. django中iframe问题

    因为在django中无法识别我们普通的url格式,比如使用<iframe src="articles.html"></iframe>,这种格式django无 ...

  3. 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_5-5.HttpClient4.x工具获取使用

    笔记 5.HttpClient4.x工具获取使用     简介:讲解httpClient4.x相关依赖,并封装基本方法. 1.加入依赖         <dependency>       ...

  4. es6 实现双链表

    const util = require('util'); /** * 链表节点类 */ class Node { constructor (ele) { this.ele = ele; this.n ...

  5. 如何写resultful接口

    一.协议 API与客户端用户的通信协议,总是使用HTTPS协议,以确保交互数据的传输安全. 二.域名 应该尽量将API部署在专用域名之下: https://api.example.com 如果确定AP ...

  6. React Native创建项目等待时间长解决

    1. 初始化工程 在终端输入命令 :react-native init AwesomeProject 从命令上看,看起来是初始化一个工程,于是, 1分钟...... 10分钟...... 1小时... ...

  7. rsync重启的shell脚本

    https://zhidao.baidu.com/question/2078634436717887028.html

  8. Golang的goroutine协程和channel通道

    一:简介 因为并发程序要考虑很多的细节,以保证对共享变量的正确访问,使得并发编程在很多情况下变得很复杂.但是Go语言在开发并发时,是比较简洁的.它通过channel来传递数据.数据竞争这个问题在gol ...

  9. lua学习笔记2--table

    table是lua中的一种"数据/代码结构",可以用俩创建不同的"数据类型"lua语言中的数组其实就是table类型 array = {, , , , } pr ...

  10. LeetCode.1189-balloon实例数最大值(Maximum Number of Balloons)

    这是小川的第次更新,第篇原创 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第267题(顺位题号是1189).给定一个字符串文本,使用文本字符来构成单词"balloon&qu ...