使用正文作为委托时选择特定元素

Question

我理解它建议使用body作为.on（）事件的委托：

$('body').on('click', 'button', function() {
    $('input[type="checked"]').removeAttr('checked');
});

我遇到麻烦的地方是尝试选择特定元素但属于同一类型。所以，例如，如果我有一个具有唯一类，id等的按钮，我最终会选择DOM中的第一个按钮。

$('body').on('click', $('button#clear'), function() {
    $('input[type="checked"]').removeAttr('checked');
});

使用.on（）时是否有解决方法？

加分：是否有时间不应将身体用作代表？如果是这样，那么第二个最好的替代方案是什么？

Answer 1

body不是推荐的本身，它只是一个安全的赌注它会起作用，因为你的目标元素可能是body的孩子 - 实际上，你应该使用AJAX内容的静态容器作为初始选择器，例如：

<div id="container">
    <!--I GET POPULATED WITH AJAX CONTENT-->
    <input id="ajaxInput" /> <!--I came from an AJAX call-->
</div>

现在你可以使用

$("body").on("click", "#ajaxInput", function() { });

但是每次点击body时都会运行检查。一个更好的选择器将是：

$("#container").on("click", "#ajaxInput", function() { });