1

RawClicked私はこのようなイベントのためのtrの古い割り当てメソッドを持っています：

<tr ondblclick="RawClicked(this) .......

このようにJavaScriptコードでイベントを添付し、HTMLタグでのイベントハンドラーの割り当てを削除します<tr .... >。

var element = document.getElementById("CustomersTable").getElementsByTagName("tr");
AssigningEventHandles(element, "dblclick", RawClicked(this));

function AssigningEventHandles(element, event, handler) {
    if (element.addEventListener) {
        element.addEventListener(event, handler, false);
    }

    else if (element.attachEvent) {
        element.attachEvent("on"+ event, handler);
    }
}


function RawClicked(raw) {
    var rawDoubleClicked = raw.id;
    alert(rawDoubleClicked);
}

thisでは、この場合、どのようにパラメーターを関数に渡すことができますか？

4

2 に答える 2

1

  1. この例elementでは、単一の要素ではなくノードのコレクションであるため、この方法でイベントリスナーを追加することはできません。このノードのコレクションを反復処理するか、イベント委任を使用してイベントリスナーをにアタッチできます<table>。

  2. この行AssigningEventHandles(element, "dblclick", RawClicked(this));では、RawClickedがthisグローバルオブジェクトにバインドされて実行されます。したがって、渡された引数handlerはAssigningEventHandlesこの関数の結果であり、無効です。次のような関数を渡す必要があります。AssigningEventHandles(element, "dblclick", RawClicked);次に、 inthis.idの代わりにを使用します。raw.idRawClicked

修正されたコード：

var element = document.getElementById("CustomersTable").getElementsByTagName('tr');
AssigningEventHandles(element, "dblclick", RawClicked);

function AssigningEventHandles(element, event, handler) {
  if( !element.length ){ /* convert to array if it's a single node */
    element = [element];
  }
  for( var i=0; i<element.length; i++){ /* iterate over nodes and attach event listeners */
    if (element[i].addEventListener) {
        element[i].addEventListener(event, handler, false);
    }

    else if (element[i].attachEvent) {
        element[i].attachEvent("on"+ event, handler);
    }
  }
}

function RawClicked() {
/* `this` is bound to the clicked element */
    var rawDoubleClicked = this.id;
    alert(this);
}

http://jsfiddle.net/WU76d/

于 2013-01-17T20:30:52.560 に答える
-1

Firefox（addEvenListenerを使用）では、ハンドラーは要素のスコープで実行されているように見えるため、RawClickedで「this」を使用するだけで意図したとおりに機能するはずです。

于 2013-01-17T20:37:45.420 に答える