js事件繫結的幾種方式

2022-03-07 18:22:27 字數 1280 閱讀 3086

1

點選按鈕

2

使js**與hrml標籤分離,文件結構清晰,便於開發和管理

1

點選按鈕

2

繫結語法:element.attachevent(event,function)

event : (必需)事件型別,需要加「on」

function:(必需)指定事件觸發時執行的函式

1

點選按鈕

2

事件處理函式中,this代表的是window物件

移出語法:element.detachevent(event,function)

語法:element.addeventlistener(event,function,usecapture)

event : 不需要加「on」

usecapture:(可選)指定事件是否在捕獲或冒泡截斷進行。true,捕獲。false,冒泡。預設false。

1

點選按鈕

2

事件處理函式中,this代表dom物件

移出:語法:element.removeeventlistener(event,function,usecapture)

1

點選按鈕

2

1

var btn = document.getelementbyid('btn1');

2 btn.onclick = function

() ;

5 btn.onclick = function

()

上述**只彈出了hello2。也就是只執行了第二個函式

1

var btn = document.getelementbyid('btn1');

2 btn.addeventlistener('click', function

() )

5 btn.addeventlistener('click', function

() )

上述**兩個函式都能執行

特殊例子,繫結同乙個事件處理函式,並且都是事件冒泡或者事件捕獲型別,那麼只能繫結一次。

1

點選按鈕

2

匿名函式之間即使**完全一樣,也是互不相同的。

如果要解除相應的繫結,那麼繫結的事件不能使用匿名函式,必須將事件處理函式單獨寫成乙個函式,否則無法取消。

React事件繫結的幾種方式對比

class button extends react.component handleclick render click me button class button extends react.component render click me button class button exten...

React事件繫結的幾種方式對比

由於類的方法預設不會繫結this,因此在呼叫的時候如果忘記繫結,this的值將會是undefined。通常如果不是直接呼叫,應該為方法繫結this。繫結方式有以下幾種 class button extends react.component handleclick render class butt...

jQuery中的事件繫結的幾種方式

jquery目前有on bind delegate live 四種繫結方式,但是隨著版本的不斷更新,有的方式也相應的被淘汰掉 band 方式繫結 3.0版本之前的繫結方式比較常用的是bind 繫結事件,解除事件的方式是unbind 但是在3.0之後band 的繫結方式也別相應的解除掉了。bind 的...