javascript - jQuery 不适用于动态添加的元素

Question

我想使用.on在动态创建的元素上...虽然它不起作用，是的，我正在使用选择器:)

$(".metadata").on("click", "i.icon-remove", function () {
    console.log("what");
    $(this).parent(".metadata").slideUp(function () { $(this).remove(); });
});

这非常适合现有内容，但不适用于动态创建的任何内容。初始内容和动态内容都使用完全相同的创建方法，因此我知道它们的签名是相同的，有什么想法吗？

这是我的 HTML，第一个项目存在于 HTML 中，第二个项目是动态创建的

<div class="metadata">
    <input type="text" value="" style="width: 200px;">
    <i class="icon-remove"></i>
</div>
<div class="metadata" style="">
    <input type="text" maxlength="100" style="width: 200px;">
    <i class="icon-remove"></i>
</div>

Answer 1

试试这个

$(document).on("click", ".metadata i.icon-remove", function () {
    console.log("what");
    $(this).parent(".metadata").slideUp(function () { $(this).remove(); });
});