0

クリックするイベントリスナーを追加しようとしていますが、クリックされたノードの位置を知りたいです

function evl(etna) {
    document.addEventListener("click", function (el) {
        alert("You clicked on " + 'the name of element that was clicked or his array code');
    }, false);
};

ここetnaで:

document.getElementsByTagName("*");
4

2 に答える 2

1
function evl(etna){
    document.addEventListener("click",function (el) {
        var clickedElement = el.target || el.srcElement;
        alert("Link detected a click. Cancellable: "+clickedElement.name);
        for(var i = 0; i < etna.length; i++) {
            if(etna[i] === clickedElement) {
                //i is a position of an element in etna
                break;
            }
        }
      },false);
};

thisクリックされた要素を指すを使用できます。Phil H IE 8 に関しては、そのようには機能しません。しかしとにかく、使用する必要があり.targetます.srcElement。そして多分それはそのIDを取得する方が良いでしょう。Name属性は、div、spansなどには無効です。

ただし、イベントをに添付することもできますdocument。そして、これはドキュメントを指します。その代わりに、クリックが実際に発生したノードへのポインタel.target || el.srcElementであるwhereを使用する必要があります。.target/.srcElement

また、によって返される配列内の要素(実際にはノードリスト)のインデックスを取得できるとは思いませんdocument.getElementsByTagName("*")(まあ、そのリストを取得してループで繰り返し、各要素が等しいかどうかを確認できますthis)。さらに、なぜそれが必要になるのかわかりません。

于 2012-11-13T13:40:24.983 に答える
0

etnaループを追加し、配列内のアイテムごとにイベントリスナーを異なる方法で設定します。

function evl(etna){
    for(var i=0; i < etna.length; ++i) {
        (function() {
            var thisNode = etna[i];
            var localval = i;
            etna[i].addEventListener("click",function (el) {
                alert("Link detected a click. Cancellable: "+ thisNode.id + " which is id " + localval );
            },false);
        })();
    }
}

動作中のjsfiddle:http: //jsfiddle.net/5xDjE/

すぐに呼び出される関数は、thisNodeとのスコープを強制するだけですlocalval。それ以外の場合は、すべての要素が同じ変数への参照を取得します(javascriptのスコープは興味深いものです)。

localvalノードの元の配列を保持する必要があるため、インデックス(を介してスコープ)を使用しないことをお勧めします。ノードは時間の経過とともに変化し、javascriptは参照カウントを行うため、このようなノードの長い配列は避けたいと考えています。

thisIE8では、クリックされた要素が常にあるとは限らないことに注意してください。この下では、グローバルウィンドウオブジェクトを指します

于 2012-11-13T13:44:19.590 に答える