javascript - 动态创建的按钮 onClick 不起作用

Question

我有以下代码，在 $(document).ready() 中被调用:

btnHolders.appendChild(_createButton("Note", function(){
    showNote();
}));

var _createButton = function(name, func){
  var btn = document.createElement("input");
  btn.type = "button";
  btn.id = "btn" + name;
  btn.onclick = func;
  btn.value = name;

  return btn;
};

但是，当我查看源代码时，我得到以下信息:

<input type="button" id="btnNote" value="Note">

Answer 1

当您调用之前未定义的函数时，我对您的代码进行了一些重构。另外，既然您已经包含了它，为什么不使用 jQuery 来缩短代码呢？

var btnHolders = $('#btnHolders');

_createButton("Note", showNote);

function _createButton(name, func){
  var btn = $('<input/>').attr({
      'type': 'button',
      'id': 'btn' + name,
      'value': name
  }).bind('click', func);

  btnHolders.append(btn);
};

function showNote() {
    console.log('test');
}

DEMO