javascript - jQuery - 动态生成的孩子不会触发点击

Question

我的代码：

$(".test1").children().click(function(){
    $(".test2").append('<span>something</span>');           
});

$(".test2").children().on('click', function(){
    alert("done");      
});

单击 test1 的子级后，带有“something”的跨度应该是 test2 的最后一个子级。我的追加做对了吗？test2 上的点击事件是否正确完成？

谢谢！

Answer 1

这有效：

$(".test1").children().click(function(){
    $(".test2").append('<span> something</span>');           
});

$(".test2").on('click', 'span', function(){
    alert("done");      
});

现场演示

Answer 2

好的，只是关于您的追加的一点解释，您的追加是正确的，但是您在追加$(".test2").children()新的孩子之前附加了点击事件（点击了 test1）。所以点击事件永远不会附加到跨度。