10

クラス名が10個ある場合keyword：

<div class="keyword"></div>

たとえばclick、この要素にイベントを添付するにはどうすればよいですか。

私は次のことを試しましたが、運がありませんでした:(アラートが表示されません）

document.getElementsByClassName('.keyword').onclick = function()
{
    alert(true);
    Search.addKey(this.getElementsByClassName('name')[0].innerHTML);
}

要件：

  • onclick属性なし
  • jQueryやその他のライブラリはありません

注：要素はページの読み込み時に生成されません。それらの数は、たとえばボタンをクリックするたびに異なる場合があります。

'future'のクラス'keyword'ですべてのタグにアタッチする方法が必要です。

4

1 に答える 1

18

イベントを委任する必要があります。これを試して：

if (document.body.addEventListener)
{
    document.body.addEventListener('click',yourHandler,false);
}
else
{
    document.body.attachEvent('onclick',yourHandler);//for IE
}

function yourHandler(e)
{
    e = e || window.event;
    var target = e.target || e.srcElement;
    if (target.className.match(/keyword/))
    {
        //an element with the keyword Class was clicked
    }
}

イベントの委任について詳しくは、quirksmode.comをご覧ください。AFAIK、これはあなたが達成しようとしていることを達成するための最良の方法です。これは、すべての主要なライブラリ（プロトタイプ、jQuery、...）が舞台裏でどのように機能するかです。

更新：

これがフィドルです。もう少し説明が含まれています。興味深いリファレンスはこのページです。IEとW3Cのイベントの違いを理解するのに役立ち、重要なことに、イベント委任の価値と無数の利点を理解するのに役立ちました。

于 2012-06-30T11:42:45.717 に答える