今天在給元素註冊事件的時候,使用addEventListener遇到了一個問題,這個好像之前也遇到過,覺得有必要總結一下,就是JS函數作為參數引發的問題。首先看以下程式碼,覺得下面程式碼有問題嗎?是否能達到點擊id3對應的元素後,彈出id3呢?
範例1
var obj3=document.getElementById('id3'); obj3.addEventListener('click',curClick('id1'),true); function curClick(id){ alert(id); }
答案是否定,不能達到我想要的效果,因為這行程式碼在頁面載入完成時候,就會彈出id3。當我點擊id3對應的元素時候,頁面沒有任何反應。
於是我將程式碼改為以下兩種情況:
#範例2
var obj3=document.getElementById('id3'); obj3.addEventListener('click',function(e){curClick('id3');stopPropagation(e)},true); function curClick(id){ alert(id); }
例3
var obj1=document.getElementById('id1'); obj1.addEventListener('click',curClick1,true); function curClick1(){ alert('okey'); }
這次執行正常了,這是為什麼呢?
因為在JS世界裡curClick('id3')就是直接呼叫curClick('id3'),而非將其作為一個參數來傳遞,如果要將其作為一個參數來傳遞,如果不需要傳遞參數,直接傳遞函數名稱就可,如果需要傳遞參數,有兩種解決辦法
方法一:借助匿名函數,將要傳遞的函數,放在匿名函數中,將匿名函數作為參數如例2
eg:將function(){myfunction(val1,val2,......);}作為參數傳遞。
第二:改寫需要傳遞函數
function curClick1(val){ <span style="white-space:pre"> </span>return function(){ alert(val); }; }
以上就是JS中把函數當作另一函數的參數傳遞總結的內容,更多相關內容請關注PHP中文網(m.sbmmt.com)!