首頁 > web前端 > js教程 > 主體

JS中把函數當作另一函數的參數傳遞總結

黄舟
發布: 2017-03-01 15:11:03
原創
1124 人瀏覽過

今天在給元素註冊事件的時候,使用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中文網(www.php.cn)!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板