自定義事件

xietao3 發(fā)布于2019-08-20 12:08 / 2430人閱讀

摘要：公司日常開發(fā)的項目很少有能使用到自定義事件的，已有的事件就夠用了，但作為一個前端人員，學習這個還是有必要了解和學習一下，可能在以后會使用到。。在冒泡過程中，如果有一個元素定義了該事件的監(jiān)聽函數(shù)，該監(jiān)聽函數(shù)就會觸發(fā)。

公司日常開發(fā)的項目很少有能使用到自定義事件的，已有的事件就夠用了，但作為一個前端人員，學習這個還是有必要了解和學習一下，可能在以后會使用到。。

下面看下代碼

方式一：

// 新建事件實例
var event = new Event("build");

// 添加監(jiān)聽函數(shù)
elem.addEventListener("build", function (e) { ... }, false);

// 觸發(fā)事件
elem.dispatchEvent(event);

該事件會層層向上冒泡。在冒泡過程中，如果有一個元素定義了該事件的監(jiān)聽函數(shù)，該監(jiān)聽函數(shù)就會觸發(fā)。

方式二：

var myEvent = new CustomEvent("myevent", {
  detail: {
    foo: "bar"
  },
  bubbles: true,
  cancelable: false
});

el.addEventListener("myevent", function(event) {
  console.log("Hello " + event.detail.foo);
});

el.dispatchEvent(myEvent);

CustomEvent構(gòu)造函數(shù)的第一個參數(shù)是事件名稱，第二個參數(shù)是一個對象，該對象的detail屬性會綁定在事件對象之上。

GPU云服務器云服務器自定義事件 js 自定義觸發(fā)事件自定義頭像自定義

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/80818.html

相關(guān)文章

【Vue原理】Event - 白話版

摘要：寫文章不容易，點個贊唄兄弟專注源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基于版本如果你覺得排版難看，請點擊下面鏈接或者拉到下面關(guān)注公眾號也可以吧原理白話版事件是我最感興趣的東西之寫文章不容易，點個贊唄兄弟專注 Vue 源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基于...

kumfo 2019-08-23 18:35 評論0 收藏0
javascript自定義事件淺析

摘要：首先來看看什么是自定義事件讓函數(shù)能夠具備事件的某些特性。其實自定義事件在一些主流的類庫中都有實現(xiàn)，后續(xù)會分析具體的實現(xiàn)方法。今天，我們就先用簡單的例子來實現(xiàn)自定義事件的功能。在團隊協(xié)作的很多情況下，某個js的函數(shù)會根據(jù)不斷增加的需求進而不斷增加功能，如果功能需求累積過多，我們就很難把控自己在這個函數(shù)中新定義的變量會不會覆蓋掉之前的定義。如： function action(){ ...

miya 2019-08-21 10:46 評論0 收藏0
【Vue原理】Event - 源碼版之綁定組件自定義事件

摘要：寫文章不容易，點個贊唄兄弟專注源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基于版本如果你覺得排版難看，請點擊下面鏈接或者拉到下面關(guān)注公眾號也可以吧原理源碼版之綁定組件自定義事件組件寫文章不容易，點個贊唄兄弟專注 Vue 源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內(nèi)部詳情，讓我們一起學習吧研究基于...

amuqiao 2019-08-23 18:36 評論0 收藏0
vue總結(jié)系列--組件化

摘要：觸發(fā)事件可以攜帶數(shù)據(jù)，這些數(shù)據(jù)被用于傳遞給綁定了事件的其它組件的回調(diào)函數(shù)上，進而被傳遞給其它組件。父組件可以在回調(diào)函數(shù)里做任何事情，頗有靈活性。一般情況下，父組件會在回調(diào)函數(shù)中更新自己的狀態(tài)數(shù)據(jù)。上一篇博文梳理了vue的數(shù)據(jù)驅(qū)動和響應式相關(guān)的特性，這一篇博文就來梳理vue的一個很重要的特性，組件化。自定義組件之于vue，其意義不亞于函數(shù)之于C，java之類的編程語言。函數(shù)是計算機科學...

cuieney 2019-08-22 18:28 評論0 收藏0
jQuery 事件(三) 事件的綁定和解綁、對象的使用、自定義事件

摘要：事件的綁定和解綁的多事件綁定之前學的鼠標事件，表單事件與鍵盤事件都有個特點，就是直接給元素綁定一個處理函數(shù)，所有這類事件都是屬于快捷處理。由于瀏覽器事件冒泡特性，可以在觸發(fā)時把這個事件往上冒泡到上，因為上綁定事件響應，所以能觸發(fā)這個動作。事件的綁定和解綁 on()的多事件綁定之前學的鼠標事件，表單事件與鍵盤事件都有個特點，就是直接給元素綁定一個處理函數(shù)，所有這類事件都是屬于快捷處理...

niuxiaowei111 2019-08-22 10:53 評論0 收藏0
從shakejs來看自定義事件，及addEventListener

摘要：并沒有這個事件，那就用到了自定義事件這個東西了。先看看自定義事件在中的代碼自定義事件名稱是否冒泡是否可以停止捕獲上面整個的代碼，做了一個兼容性的處理。觸發(fā)自定義事件上面是滿足頻率后就出發(fā)自定義的事件這就是觸發(fā)事件的方法。 shakejs是一個搖一搖的工具 gitHub : https://github.com/alexgibson/shake.js 使用方法 //引入初始化...

王笑朝 2019-08-21 10:27 評論0 收藏0