javascript - JQuery：将唯一的 onclick 事件分配给许多动态创建的按钮之一

Question

所以基本上我用 JQuery 制作了一堆按钮，并希望为它们提供一些常见的“onclick”功能，但希望所述功能知道有关单击它的按钮的唯一信息。使用下面的方法，无论按下什么按钮，警报消息都会打印“这个错误让我想用头撞墙 10 次”。怎么回事，伙计？谢谢你的帮助！

function createButtons()
{
 for(var i=0; i<10;i++)
 {
  $('#Mystical_land_of_buttons').append('<button class="'+i+'">'+i+'</button>');
  $('button.'+i).click(function(){gimmeYoDigits(i);});
 }
};

function gimmeYoDigits(id)
{
 alert("This bug makes me want to beat my head against a wall "+id+" times.");
}

Answer 1

您需要为此使用闭包：

for(var i=0; i<10;i++) {
    // ...
    (function(i) {
        $('button.'+i).click(function(){gimmeYoDigits(i);});
    })(i);

Answer 2

这是因为i执行 click 函数时变量不再是您所期望的。您可以执行以下操作：

var btn = $('<button>'+i+'</button>');
$('#Mystical_land_of_buttons').append(btn);
btn.data('id',i).click(function(){gimmeYoDigits($(this).data('id'));});