javascript - 附加元素后，事件单击不适用于 jQuery 中的附加元素

Question

我正在通过 jQuery 附加项目。但是附加后无法将事件绑定(bind)到附加项上。我附加如下:

var item =  '<div id="'+newInputId+'" class="col-md-9" style="padding-right: 0px;">';
    item += '<input id="txtInScope" type="text" value="'+currentScopeVal+'" class="form-control" readonly="readonly"/>';
    item += '</div>';
    item += '<div id="inScopeActionDiv'+newInputId+'" class="col-md-3"  style="padding-left: 2px;">';
    item += '<button type="button" class="btn btn-warning btn-sm remButton" title="Remove this item">Remove Item</button>';
    item += '</div>';    
$('#inScopeDiv').append(item);

添加这个之后，我想在上面的 remButton 类上绑定(bind)一个点击事件，如下所示:

$("#inScopeDiv").delegate(".remButton", "click", function(){
    alert('you clicked me again!');
});
$('#inScopeDiv').on('click', '.remButton', function() {
    alert("working");
})
$('.remButton').live('click', function() {
    alert('live');
})

但是没有结果。接下来我可以尝试什么？

Answer 1

$('.remButton').live('click', function() {
    alert('live');
})

jquery 方法 live 不再有效:

“从 jQuery 1.7 开始，不推荐使用 .live() 方法。使用 .on() 来附加事件处理程序。旧版本 jQuery 的用户应该优先使用 .delegate() 而不是 .live()。”

来源:jquery live

关于事件附件的小解释:

在调用添加事件函数(在本例中为 jQuery 的 on 方法)之前，您必须意识到要添加事件的目标已经存在。

另一方面，存在于 jquery 中的一种方式，可以在不存在元素之前使工作成为事件附件:

$('html').on('click', '#inScopeDiv .remButton', function () {
  alert('works!');
});