js 監聽事件的疊加和移除

2022-07-26 19:57:11 字數 773 閱讀 2777

html dom元素有很多on開頭的監聽事件,如onload、onclick等,見dom事件列表。但是同一種事件,後面註冊的會覆蓋前面的:

window.onresize = function()

window.onresize = function()

// 改變視窗大小時,只會彈出2

利用addeventlistener新增監聽事件,可以重複新增,並不會互相覆蓋: 

window.addeventlistener("resize",function())

window.addeventlistener("resize",function())

// 改變視窗大小時,先後彈出1和2

注意這裡面的事件是不帶"on"字首的。

removeeventlistener跟addeventlistener相對應,用於移除事件監聽。

如果要移除事件控制代碼,addeventlistener() 的執行函式必須使用外部具名函式,匿名函式事件是無法移除的。

// 匿名函式事件無法移除

window.addeventlistener("resize",function())

// 監聽具名函式事件

function myresize()

window.addeventlistener("resize",myresize)

// 移除事件監聽

window.removeeventlistener("resize",myresize)

vue的計算屬性和監聽事件

每個計算屬性都包括乙個setter和乙個getter,但是setter方法並不常用,所以可以簡寫,沒有setter方法就只能讀取,無法修改 data computed 包含了setter方法 set name 省略了setter方法的簡寫 getfullname2 function 執行結果 met...

vue移除window視窗監聽事件兩種方法

例子 頁面視窗變化時,echarts繪製的檢視需要resize 這時需要監聽window,但是當元件消耗時也需要移除視窗監聽事件。涉及到的data資料和methods data data methods chartresize 500 第一種方法 在beforedestroy鉤子函式裡銷毀 moun...

JS 金額自動計算與合計(監聽事件)

1 專案中有時要在頁面裡面自動計算金額,如 左邊框裡面是數量,右邊被禁用的文字框裡是金額,而這個金額是根據客戶輸入數量的多少來自動計算的 數量 單價 金額 這裡是用到onkeyup事件來呼叫cul charge函式計算金額。js裡面計算用eval bat v bat charge 有時候金額額度大需...