javascript - ajax 请求后新添加的按钮没有运行他应该运行的事件

<分区>

我什至在点击按钮时也有 jQuery:

$('button.btn').on('click', function(form)

页面加载后的示例现有按钮:

<button id="5" class="yellow-button btn">Odpublicznij</button>

完美适用于类 btn 的所有按钮

但是在 ajax 请求之后 onclick 将新按钮添加到 html

content += '<button id="' + comments[i].id + '" class="green-button btn">Upublicznij</button>';

它添加了新的按钮，例如:

<button id="11" class="yellow-button btn">Odpublicznij</button>

这个新按钮甚至不会运行 $('button.btn').on('click', function(form) .

我需要它来举办这个事件，而不是仅仅作为一个什么都不做的按钮出现在这里

最佳答案

出现此问题是因为您刚刚附加的新元素没有附加点击处理程序。为了解决这个问题，您需要像这样更改选择器

$('body').on('click', 'button.btn', function(form) {
  //code goes here
});

我们在这里做的叫做Event Delegation .

关于javascript - ajax 请求后新添加的按钮没有运行他应该运行的事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44890970/

相关文章：

Javascript 如果有类，警报 "yes"，否则警报 "no"