为使用 jQuery 动态创建的按钮添加单击事件[重复]

如何在使用 jQuery 动态添加的按钮上添加按钮单击事件？

在 a 中添加动态按钮的 jQuery 代码div容器：

$('#pg_menu_content').empty();
$div = $('<div data-role="fieldcontain"/>');
$("<input type='button' value='Dynamic Button' id='btn_a' />").appendTo($div.clone()).appendTo('#pg_menu_content');

问题一：如何为上面的按钮添加点击事件？我尝试了下面的方法，但没有触发

$("#btn_a").click(function(){
  alert ('button clicked');
});

问题2：如何获取点击事件中按钮的值？例如，我想获取单击事件函数内的值“动态按钮”。

你们能帮我解决这个问题吗？

使用绑定到容器的委托事件处理程序：

$('#pg_menu_content').on('click', '#btn_a', function(){
    console.log(this.value);
});

也就是说，绑定到 JS 运行时存在的元素（我假设#pg_menu_content页面加载时存在），并在第二个参数中提供选择器.on()。当点击发生在#pg_menu_contentelement jQuery 检查它是否应用于与匹配的该元素的子元素#btn_a选择器。

或者在创建按钮后绑定标准（非委托）单击处理程序。

无论哪种方式，在点击处理程序中this将引用有问题的按钮，所以this.value会给你它的价值。