js 或 .addEventListener 解決動態繫結事件時不能傳參的問題
阿新 • • 發佈:2020-07-27
問題描述:
舉個例子,假如我們有一個div (id="div1"), 我們想給它繫結一個onclick事件並傳入字串引數:
(錯誤案例, 會導致如下後果)
會導致載入頁面時就執行了,並沒有等到點選事件觸發, 並且點選後不執行;
var div=document.getElementById('div1'); div.onclik=fun('傳入實參'); function fun(arg) { alert(arg); }
正確的繫結方式是這樣的:
var div=document.getElementById('div1'); div.onclik=fun; function fun() { alert(""); }
也就是直接把方法名賦給 dom物件的onclick事件,
但這樣就不能傳參了啊, 別急,老衲有一妙計
帶引數的繫結:
var div=document.getElementById('div1'); div.onclik=function () { fun("此處傳入實參"); } function fun(arg) { alert(arg); }
也就是說除了直接把方法名賦給 dom物件的onclick事件,
還可以在onclick事件事件後定義一個方法, 我們可以在方法體中掉用我們真正的方法並傳入我們想要的引數,
需要注意的是:
臨時定義的這個函式中 this指的是div物件, 所以我們想傳入div物件時使用 this就可以了