国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > C# > 正文

js事件模型與自定義事件實(shí)例解析

2020-01-24 00:52:11
字體:
供稿:網(wǎng)友

JavaScript 一個(gè)最簡單的事件模型,需要有事件綁定與觸發(fā),還有事件刪除。

var eventModel = { list: {}, bind: function () { var args = [].slice.call(arguments), type = args[0], handlers = args.slice(1); if (typeof type === 'string' && handlers.length > 0) {  for (var i = 0; i < handlers.length; i++) {  if (typeof handlers[i] === 'function') {   if (!this.list[type]) {   this.list[type] = [];   }   this.list[type].push(handlers[i]);  }  } } }, unbind: function () { var type = arguments[0], handlers = Array.prototype.slice.call(arguments, 1); if (typeof type === 'string') {  if (handlers.length === 0) {  this.list[type] = [];  } else {  for (var i = 0; i < handlers.length; i++) {   if (typeof handlers[i] === 'function' && handlers[i] === this.list[type][i]) {   this.list[type].splice(i, 1);   }  }  } } }, trigger: function () { var arguments = [].slice.call(arguments), type = arguments[0], args = arguments[1] instanceof Array && !arguments[2] ? arguments[1] : arguments.slice(1), handlers = this.list[type]; for (var i = 0; i < handlers.length; i++) {  handlers[i].apply(this, args.splice(0, handlers[i].length)); } }};

其中主要實(shí)現(xiàn)了bind(綁定事件)、unbind(刪除事件)與 trigger (觸發(fā)事件)。對(duì)同一事件名稱,可以綁定多個(gè)事件處理函數(shù);并按照綁定的順序依次觸發(fā)。

args.splice(0, handlers[i].length) 觸發(fā)時(shí)的傳參

事件綁定與觸發(fā):

eventModel.bind('myevent1', function (a) { console.log(a); // 1}, function(b) { console.log(b); // 2}, function(c, d) { console.log(c + ' + ' + d); // a + b});eventModel.bind('myevent1', function (e) { console.log(e); // 50});eventModel.trigger('myevent1', 1,2,'a','b', 50);

事件刪除:

<button id="bind">bind</button><button id="unbind">unbind</button>
var fnX = function () { console.log('fnX');}var fnY = function () { console.log('fnY');}eventModel.bind('myevent2', fnX, fnY);document.getElementById('unbind').onclick = function () { eventModel.unbind('myevent2', fnX); //刪除 fnX 后,只剩下 fnY};document.getElementById('bind').onclick = function () { eventModel.trigger('myevent2'); //輸出 fnX fnY //在點(diǎn)擊unbind后,只輸出 fnY};

以上就是本文的全部內(nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時(shí)也希望多多支持武林網(wǎng)!

發(fā)表評(píng)論 共有條評(píng)論
用戶名: 密碼:
驗(yàn)證碼: 匿名發(fā)表
主站蜘蛛池模板: 武乡县| 思茅市| 福清市| 南陵县| 墨脱县| 汕尾市| 安陆市| 红安县| 旌德县| 永丰县| 丰都县| 天长市| 盱眙县| 崇礼县| 定结县| 迁安市| 秭归县| 荣昌县| 九龙县| 南开区| 唐山市| 兴和县| 葫芦岛市| 滦南县| 板桥市| 永仁县| 雅安市| 钦州市| 辽宁省| 左权县| 象州县| 密云县| 栖霞市| 湾仔区| 夏津县| 迭部县| 山阳县| 龙陵县| 南江县| 新干县| 遵化市|