javascript 自定义事件 发布-订阅 模式 Event
* javascript自定义事件
var myEvent = document.createEvent("Event");
myEvent.initEvent("myEventName", true, true); var element = document.createElement("div");
element.addEventListener("myEventName", function(evt) {
console.log(evt);
// handle event
});
element.dispatchEvent(myEvent);
output:
Event {isTrusted: false, type: "myEventName", target: div, currentTarget: div, eventPhase: 2, …}
@Ref:
// Function synopsis
event.initEvent(eventType,canBubble,cancelable)
Usage:
function trigger(dom, event) {
var myEvent = document.createEvent('Event')
myEvent.initEvent(event, true, true);
dom.dispatchEvent(myEvent);
}
trigger(tab, "mouseover");
* 发布-订阅 模式
var salesOffices = {
clientList: [],
listen:function(fn) {
this.clientList.push(fn);
},
trigger: function() {
for (var i = 0, fn; fn = this.clientList[i]; i++) {
fn.apply(this, arguments);
}
return this;
}
}; // test
salesOffices.listen(function(price, squareMeter) {
console.log("price="+price);
console.log("squareMeter=" + squareMeter);
});
salesOffices.trigger(2000000,88).trigger(3000000,110);
javascript 自定义事件 发布-订阅 模式 Event的更多相关文章
- Javascript中理解发布--订阅模式
Javascript中理解发布--订阅模式 阅读目录 发布订阅模式介绍 如何实现发布--订阅模式? 发布---订阅模式的代码封装 如何取消订阅事件? 全局--发布订阅对象代码封装 理解模块间通信 回到 ...
- [转] Javascript中理解发布--订阅模式
发布订阅模式介绍 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知. 现实生活中的发布- ...
- 【转】Javascript中理解发布--订阅模式
Javascript中理解发布--订阅模式 阅读目录 发布订阅模式介绍 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时 ...
- javascript中的发布订阅模式与观察者模式
这里了解一下JavaScript中的发布订阅模式和观察者模式,观察者模式是24种基础设计模式之一. 设计模式的背景 设计模式并非是软件开发的专业术语,实际上设计模式最早诞生于建筑学. 设计模式的定义是 ...
- [转] JavaScript设计模式之发布-订阅模式(观察者模式)-Part1
<JavaScript设计模式与开发实践>读书笔记. 发布-订阅模式又叫观察者模式,它定义了对象之间的一种一对多的依赖关系.当一个对象的状态发生改变时,所有依赖它的对象都将得到通知. 例如 ...
- JavaScript设计模式(发布订阅模式)
发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在JavaScript开发中,我们一般用事件模型来替代传统的发布—订阅模式 ...
- Javascript设计模式之发布-订阅模式
简介 发布-订阅模式又叫做观察者模式,他定义了一种一对多的依赖关系,即当一个对象的状态发生改变的时候,所有依赖他的对象都会得到通知. 回忆曾经 作为一名前端开发人员,给DOM节点绑定事件可是再频繁不过 ...
- JavaScript设计模式_05_发布订阅模式
发布-订阅模式,定义了对象间的一种一对多的依赖关系,当一个对象的状态发生变化时,所有依赖它的对象都将得到通知.发布-订阅模式是使用比较广泛的一种模式,尤其是在异步编程中. /* * pre:发布-订阅 ...
- javaScript设计模式:发布订阅模式
发布订阅模式的思想是在观察者模式的基础上演变而来,在观察者模式中客户端监听到对象某个行为就触发对应任务程序.而在发布订阅模式中依然基于这个核心思想,所以有时候也会将两者认为是同一种设计模式.它们的不同 ...
随机推荐
- SIM900A—基础指令
文章目录 1.ATE指令设置回显 2.ATQ指令设置返回 3.ATV指令设置返回格式 4.AT+CFUN设置模块功能 5.AT+IPR设置波特率 6.AT+CMEE设置上报错误格式 7.各种码(IME ...
- SpringBoot - 集成RocketMQ实现延迟消息队列
目录 前言 环境 具体实现 前言 RocketMQ是阿里巴巴在2012年开源的分布式消息中间件,记录下SpringBoot整合RocketMQ的方式,RocketMQ的安装可以查看:Windows下安 ...
- elasticsearch可视化工具-dejavu
https://github.com/appbaseio/dejavu docker run -p 1358:1358 -d appbaseio/dejavu http.port: 9200 http ...
- WPF日积月累之TreeView动态绑定
一.概述 本文演示了如何递归生成数据,用于绑定TreeView以及TreeItem的双击事件. 二.参考代码 1 using System; 2 using System.Collections.Ge ...
- CSS定位(慕课网学习笔记)
定位模型 static自然模型 relative相对定位模型 absolute绝对定位模型 fixed固定定位模型 sticky磁铁定位模型 possition之static(默认的设置)(静态定位. ...
- jsp中核心标签使用
<%@ page language="java" import="java.util.*, java.lang.*" pageEncoding=" ...
- Lyndon 相关的炫酷字符串科技
浅谈从 Lyndon Words 到 Three Squares Lemma By zghtyarecrenj 本文包括:Lyndon Words & Significant Suffixes ...
- Element form表单方法resetFields无效
之前遇到resetFields无效时都是自己手动用this.ruleForm = Object.assign({}, this.ruleForm, this.$options.data().ruleF ...
- ecshop文件架构
/*ECShop 2.5.1 的结构图及各文件相应功能介绍ECShop2.5.1_Beta upload 的目录┣ activity.php 活动列表┣ affiche.php 广告处理文件┣ aff ...
- uni-app 小程序从零开始的开发流程
前言 本文基于 HBuilderX 3.1.22 + 微信开发者工具 1.05.2106300为主要内容进行说明. 文档版本:1.0.0 更新时间:2021-09-03 15:32 一.准备 uni- ...