javascriptのクリックイベントハンドラは、クリックすることなく起動します

Question

指定されたボタンをクリックせずにこの機能が起動するのはなぜですか？ 私はいくつかの似たような問題を見ましたが、このコード構造を扱ったものはありませんでした。

document.getElementById("main_btn").addEventListener("click", hideId("main"); 

function hideId(data) { 
    document.getElementById(data).style.display = "none"; 
    console.log("hidden element #"+data); 
} 

ありがとうございます！

Answer 1

あなたはそれを直接呼んでいます。

document.getElementById("main_btn").addEventListener("click", hideId("main"); 

コールバックで行う必要があります。

document.getElementById("main_btn").addEventListener("click", function(){ 
    hideId("main"); 
}); 

Answer 2

このコードは、あなただけのコールバックの名前を渡す必要がありますあなたの関数hideId("main")を実行します。

document.getElementById("main_btn").addEventListener("click", hideId); 

function hideId(event) { 
    var id = event.target.srcElement.id; // get the id of the clicked element 
    document.getElementById(data).style.display = "none"; 
    console.log("hidden element #"+data); 
} 

Answer 3

document.getElementById("main_btn").addEventListener("click", hideId.bind(null, "main");