如何在当前元素上设置单击功能？

Question

我试图在我从jQuery添加的role=button元素上动态设置click函数。这是我的代码：

box_resources.forEach(function(box){
  var title_button = '<a class="btn btn-primary btn-xs" style="margin:5px">' + title + '</a>';
  var $list_item = $(title_button);
  $list_item.click(function() {
    console.log("hello");
  });
  $("#resources-master-list").append(title_button); 
});

似乎这种方式不起作用。有谁有想法吗？谢谢！

Answer 1

每次向DOM添加项目时，请尝试使用 event delegation ，而不是添加新的点击处理程序。要了解其工作原理，请查看链接以获取更多信息。

$(document).on("click", "[role='button']", function () {
  alert("i'm clicked");
});