以2個參數傳遞函數的addEvent監聽方法

我試圖通過其中有2個參數對特定按鈕的addEventListener方法的功能，但問題是直接執行時，頁面加載，而不是執行它，當有人點擊該按鈕功能。以2個參數傳遞函數的addEvent監聽方法

我知道如何使之與匿名函數的工作，但我需要它與特定定義的函數，而不是工作。

function changeContent(elem,str){ 
    elem.textContent = str; 
} 

var btn = document.querySelector("button"); 

var p = document.querySelector("p"); 

var content = "Someone Clicked the Button!"; 

// add event listener on click to the button 

// version 1 with anonymous function worked as expected 

btn.addEventListener("click",function(){ 
    p.textContent = content; 
}); 

// version 2 with specific defined function not working as expected 

btn.addEventListener("click",changeContent(p,content));

任何想法爲什麼第二個版本不工作，以及如何使其按預期工作的原因。

更新：

我的預期和重要的問題：

有沒有什麼辦法讓changeContent(p,content)功能工作沒有addEventListener 方法用（匿名）功能包嗎？

來源

2017-04-02 Oghli

也把它包在一個匿名函數

btn.addEventListener("click",function() { 
    changeContent(p, content) 
});

的原因，任何想法，爲什麼第二個版本是不工作

因爲changeContent被稱爲中間因爲你傳遞參數（帶括號）。一般而言，您可以通過兩種方式將函數傳遞給函數：

只有名稱passFunction(changeContent);
裹在一個（匿名）功能，如上圖passFunction(function() { changeContent(...);});。匿名函數不是中間調用的，因爲你沒有傳遞參數給它。

你能解釋這一點changeContent是中間叫

如果你傳遞參數的函數，這就是所謂的。如果你把它包裝在（匿名）功能，無需傳遞參數給（匿名）功能，（匿名）函數不叫，因此也不會被包裝的函數。

有沒有什麼辦法讓它不工作了（匿名）函數

使用.bind功能包裹。第一個參數是this的值。所以，你需要爲這個情況下3個參數：

btn.addEventListener("click",changeContent.bind(this, p, content));

欲瞭解更多信息，請參閱docs of .bind

來源

2017-04-02 20:22:21 Julian

你能解釋這一點changeContent被稱爲中間更新 – Oghli

它。讓我知道，如果它不清楚！ – Julian

我知道你不能將函數傳遞給另一個函數，如果它調用像'functionName（functionName（argument1，argument2））' 是正確的嗎？ – Oghli

以2個參數傳遞函數的addEvent監聽方法

回答

相關問題