清除并附加html后,单击"不工作"

Question

我清除后点击不工作,并使用jquery将html附加到div中.这是html代码

<div id="divMain">
</div>
<input id="btn" type="button" value="Clear&Add"/>

这是jQuery代码

var a = $('<a/>').attr({'id':'aH','href':'#'}).text('Hello');
a.click(function(){
    alert('hello');
});
$('#divMain').append(a);



$('#btn').click(function(){
   var newA = $('#aH');
    $('#divMain').html('');
    $('#divMain').append(newA);
});

这是jsfiddle

只需单击小提琴中的警报链接,它就会显示警告Clear&Add.现在单击按钮.现在单击警报.它不起作用.

Answer 1

您需要事件委派才能使用动态添加的元素绑定事件.你还需要创建带有id的elemet,aH因为你已经删除了元素DOM而没有保留它.

现场演示

$(document).on('click', '#aH', function(){
    alert('hello');
});

您可以尝试添加全局创建的a,您不需要再次绑定点击.

$('#divMain').append(a);

委托事件的优点是,它们可以处理来自稍后添加到文档的后代元素的事件.通过选择在附加委托事件处理程序时保证存在的元素,您可以使用委派事件来避免频繁附加和删除事件处理程序,jQuery api