javascript - 按钮 onclick 显示 id 和值未定义

Question

我正在向我的页面动态添加按钮，然后 onclick 我想获取 id 或 value 但它显示 undefined 。这是我的代码:

for(i=1; i<=jj; i++){
  $("#buttonPanel").append('<input type="button" class="btn btn-default" style="margin-top:20px; width: 40px;" id="'+i+'" value="'+i+'" onclick="btnpanel()"/>'+'&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp');
}

下面是事件监听器的 jQuery 代码:

function btnpanel(){
  alert($(this).attr("id"));
  alert($(this).attr("value"));
}

Answer 1

这是我做的:

for (i = 1; i <= jj; i++) {
    $("#buttonPanel").append('<input type="button" class="btn btn-default" style="margin-top:20px; width: 40px;" id="' + i + '" value="' + i + '" />' + '&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp');
}

$("#buttonPanel").on("click", ".btn", function () {
    alert($(this).attr("id"));
    alert($(this).attr("value"));
});

Here is the JSFiddle demo