0

それぞれが一意のIDを持つリンクがいくつかあります。リンクのいずれかがクリックされると、ユーザーがリンクIDを示すアラートを受け取る単一の関数を呼び出したいと思います。私は困惑しています。これが私が持っているものです。純粋なJavaScriptでこれを実行したいと思います。

私のコード：

<p><a href="#" id="link0">Link0</a></p>
<p><a href="#" id="link1">Link1</a></p>
<p><a href="#" id="link2">Link2</a></p>
<p><a href="#" id="link3">Link3</a></p>

<script>
function test(i) {
    alert("You just clicked on link:" + i); 
}

onclick = function () { 
    test(i);
};
</script>
4

4 に答える 4

1

これを試して

var links = document.getElementsByTagName( "a" );

for ( var i = 0; i < links.length; i++ ) {
    links[i].addEventListener( "click", function( e ) {
        e.preventDefault();
        alert( this.id );
    }, false );
}

デモ

于 2013-03-23T20:32:58.343 に答える
1

jQueryを使用して例を作成しました。

$(document).ready(function() {
    $("a").click(function() {
       alert(this.id); 
    });
});

http://jsfiddle.net/Yynw9/

jQueryを使用するには、ヘッダーにライブラリを含める必要がありました。

<script src="//code.jquery.com/jquery-1.9.1.js" type="text/javascript" />
于 2013-03-23T20:33:04.533 に答える
0

探しているJavaScriptは次のとおりです。

var elements = document.getElementsByTagName("a");
for(var i = 0, length = elements.length; i < length; i++) {
    elements[i].addEventListener( "click", function(e) {
        e.preventDefault();
        alert("You just clicked on link: " + this.id); 
    }, false );
}

JSFiddle： http: //jsfiddle.net/3R4FA/1/

<a>コードループは、最初にタグであるすべての要素を選択します。次に、この配列をループし、クリックイベントリスナーを各アイテムに追加します。キーワードを使用するとthis、イベントをトリガーした要素にアクセスし、IDを取得できます。

于 2013-03-23T20:34:43.377 に答える
0

これをサポートするブラウザーでは、querySelectorAllを使用して「link」で始まるすべてのIDを取得するか、クラスを追加してgetElementsByClassNameを使用できます。レガシーブラウザーでは、ソリューションはそれほどクリーンではありませんが、すべてを取得できます。ドキュメント内または要素内の「a」タグ、および「id」属性が「link」で始まるかどうかを確認します。

function test(i) {
    alert("You just clicked on link:" + this.id); 
}
if (document.querySelectorAll('a[id^="link"]')) {
    var elements = document.querySelectorAll('a[id^="link"]');
    var i = 0;
    for (i = 0; i < elements.length; i += 1) {
        elements[i].onclick = test;
    }
} else {
    var elements = document.getElementsByTagName('a');
    var i = 0;
    for (i = 0; i < elements.length; i += 1) {
        if (elements[i].id.substr(0,4) === 'link') {
            elements[i].onclick = test;
        }
    }
}

http://jsfiddle.net/Xvwme/3/

于 2013-03-23T20:35:21.683 に答える