Jquery - 从使用函数创建的按钮调用函数

Question

这在 Jquery 中有效：

<input type="button" class="go" value="GO" />

$(".go").click(function() {
$("#test").html("TEST TEST TEST");
});

但是，如果我尝试从使用以下创建的按钮访问 go 功能，则会失败。

$(".new").click(function() {
$.ajax({
        url: $(this).attr("data-value"),
        success: function(data, textStatus, xhr) {
        $('#DIV').html('<input type="button" class="go" value="go" />');
    }
}
 });
});

此代码在另一个功能点击功能完成时使用。

有什么理由吗？

谢谢

Answer 1

事件处理程序仅绑定到当前选定的元素；在您的代码进行事件绑定调用时，它们必须存在于页面上。

委托事件的优点是它们可以处理来自后代元素的事件，这些事件会在以后添加到文档中。

当您动态创建按钮时。

您需要使用Event Delegation。您必须使用委托事件方法使用.on()。

即

$(document).on('event','selector',callback_function)

理想情况下，您应该将document 替换为最近的静态容器。

例子

$('#DIV').on('click', '.go', function () {
    //Your Code     
});