4 に答える
考えられる 3 つの方法を最良の順に並べると、次のようになります。
目立たないように - JavaScript では、
addEventListener
メソッドはクリック イベント ハンドラーをアタッチするために使用されます。これは、JQuery やその他のライブラリが内部で行っていることです。以前は、代わりにIE が使用されていたと思いますattachEvent
(補足として)。onclick
アンカータグの属性 -onclick="yourEventHandler()"
.href="javascript: func();"
このように分解してみましょう。
href
最初に要素に IDを与えます。
<a href="#" id="myID">My Link</a>
これで、この要素を一意に識別できます。
その要素のイベントにアクセスする JavaScript は次のようになります。
// first get the element by id
var myLink = document.getElementById("myID");
// add an event listener to listen for clicks
myLink.addEventListener('click', function(e) {
alert(e.target.id);
// prevent the element from invoking its default event,
// which, in this case would be appending an '#' to the URL
e.preventDefault();
}, false);
ここに例があります
クライアント側コードの別の場所で、javascript イベント ハンドラーがアンカー (A) 要素のクリック イベントにバインドされていました。script
これは、構造 (HTML)、レイアウト (CSS)、およびロジック (Javascript) を互いに独立させて、関心を分離する方法として別のファイル (またはブロック) で行われます。
これhref="#"
は、ブラウザーに別のページをロードしないように指示する NOOP のようなものであり、javascript ハンドラーが割り当てられなかった場合 (つまり、クライアントが javascript をサポートしていない場合) の応急処置です。
ほとんどの場合、このa
要素にはonclick
JavaScript 関数を参照する属性があります。
<a onclick="my function()" href="#">Click me</a>