0

いくつかのリンクを作成し、ループ内で onclick ハンドラーをそれらにバインドしようとしています。リンクをクリックすると、リンク番号 (1 番目のリンクは 1、2 番目のリンクは 2、2 番目のリンクは 3 など) を示す警告ボックスを表示したいと考えています。

<html>
<body>
</body>
</html>

<script type = 'text/javascript'>
for (var i = 0; i < 10; i++) {
    var link = document.createElement("a");
    link.innerHTML = "Link " + i;
    link.href = '#';
    link.onclick = function () {
        alert("This is the link " + i);
        return false;
    };
    document.body.appendChild(link);
}
</script>

何らかの理由で、任意のリンクをクリックすると、「これはリンク 10 です」という同じ警告メッセージが表示されます。

関数が呼び出されたときにのみ、アラート関数へのパラメーターがバインドされるためでしょうか? 最終的に、ループの終了後に i の値が 10 になるためです。

4

1 に答える 1

2

簡単な答え、閉鎖を使用してください：

link.onclick = (function(j) {
    return function(){
        alert ("This is the link " + j);
        return false;
    }
})(i);
于 2013-07-07T22:43:22.890 に答える