HTMLとJavaScript - どのように部門にクリックイベントを追加しますか

Question

私は例に従ってきましたが、私のフィドルは機能していません。ここでは、コードです：

var showMessage; 
 
    var divTag = document.getElementById("myDiv"); 
 
    divTag.onClick = showMessage(); 
 
    
 
    showMessage = function() { 
 
     alert("You clicked me."); 
 
    }

<div id="myDiv" style="height: 100px; width: 100px; background-color: pink;"> 
 

 
</div>

私はおそらく愚かな何かが欠けているが、私はそれを見ることはできません。ここではdivにclickイベントを置くことができることを読んでいます。誰かが私が間違っていることを知っている？

P.S.はい、私は解読する方法やエラーを修正するか分からない。

Answer 1

はこれにあなたのJSを変更

：質問にも「jQueryの」タグ付けされているので、ここでは同じことのjQueryのバージョンだ

function showMessage() { 
    alert("You clicked me."); 
} 

var divTag = document.getElementById("myDiv"); 
divTag.addEventListener('click', showMessage); 

あなたのコード：divTag.onClick = showMessage();は、機能の応答を呼んでいました関数の代わりにshowMessage

showMessageが呼び出され、その戻り値（undefined）がonClickプロパティに渡されたものです。

マイナー問題：このページは、スクリーンリーダーを使用するブラインドユーザが使用したい場合は、<button>または<a>タグを使う方が良いでしょう。スクリーンリーダーを正しく動作させるために必要なものすべてをエミュレートする必要があります。

Answer 2

あなたはいくつかの問題がありました。あなたは関数として定義し、その後、関数とそれを呼び出すことを試み、その後、空の変数として「showMessage」を定義し

• を。
• onClickはonclickと同じではありません。
• showMessageは、（空の）戻り値の割り当てを終了した関数自体を代入するのではなく、onclickイベントに代入しようとしたときに呼び出されました。ここで

あなたのコードの修正版です：

showMessage = function() { 
 
     alert("You clicked me."); 
 
    } 
 

 
    var divTag = document.getElementById("myDiv"); 
 
    divTag.onclick = showMessage; 

<div id="myDiv" style="height: 100px; width: 100px; background-color: pink;"></div>

バニラJSです。

$('#myDiv').on("click",function() {alert("you clicked me")}); 

Answer 3

私はちょうどあなたのjQueryのソリューションあげるのjQueryをタグ付けしましたので：

$('#myDiv').click(showMessage); 

をしかし、あなたはjQueryの結合事象をクリックしていること（上記）の前showMessage機能を設定してください。