Jquery 何时使用“选择器”和何时启用（“选择器”、“选择器”）

使用jQuery

on（）

1.7版。我通常会这样绑定我的事件：

$(".foo").on("click", function() {
    console.log("foo clicked");
})

$(document).on("click", ".bar", function() {
    console.log("bar clicked");
})

现在，在看到其他人的代码后，我看到您也可以像这样绑定，为特定元素指定一个辅助参数（不确定为什么这样编写）：

如图所示，它们都做相同的事情

在第一个代码示例中，我总是直接绑定到元素，从来没有任何问题

---

我什么时候需要使用另一种绑定方式？一种绑定方式比另一种绑定方式有什么好处？

您的第二个代码示例相当于弃用的now事件。因此，当您想要订阅在订阅时DOM中还不存在的DOM元素的事件（例如，在AJAX调用后添加到DOM中的元素）时，您将使用它

您的第一个示例完全等同于

$（“.foo”）。单击（function（）{…}）

它取代了现在不推荐的
.live（）
方法

它用于将事件处理程序直接委托给元素（动态生成的“在运行中”）


如果您在（'click'，function（）{

上使用

$（'.button'）。并且假设您动态生成一个按钮，那么单击该元素将不会起任何作用。

如果使用
$（“#导航”）。在（'click'、'.button'，function（）{
上，单击处理程序将附加（委派）到任何当前和未来的
.button
元素，使其可单击

其中，
$（文档）
（速度较慢）可以是您的父元素：
$（“#您的父元素”）
（速度较快）
始终使用最近的父元素。jQuery监视冒泡的事件，并在找到一个事件后立即附加它们，这称为事件委派。当您使用默认的
文档时，jQuery必须等待该事件发生，而不是单击元素的最近父元素

您的第一个示例适用于当您将事件绑定到元素时应该存在的元素，而后面的方法适用于当前和新创建的/动态创建的元素
那么，这是否意味着一种方法是多余的，因为我想我们总是可以使用第二种绑定方法？使用一种方法比使用另一种方法有什么好处，何时可以你知道你需要哪一个吗？不，绝对不。这两个构造做不同的事情，应该根据你的需求来使用。如果你不动态地向你的DOM添加元素，你需要订阅一些事件，那么你可以使用第一个构造。另一方面，如果你需要使用动态DOM元素，那么ond更合适，因为如果选择器不返回任何元素，第一个将不会做任何事情。啊，我想我理解了。第二个示例，我假设是用于将事件绑定到文档准备好时不存在的元素，但稍后可能会被注入。到目前为止，我在注入元素时手动绑定了我的事件，因此我从不使用ond广告的需要，但现在我可能会利用它。似乎节省了一些手动延迟绑定。感谢您的快速响应。@Jason，是的，正是这样。接受此答案，因为它是第一次发布的，但其他答案也非常有用，非常感谢。感谢您的解释。我总是手动延迟绑定，从未意识到您可以n使用
on（）
。很高兴知道：）@Jason不客气！在这里你可以玩来看看区别：甜心，我更新了小提琴（）现在我明白了，当您在document ready之前绑定，然后在document ready上附加绑定到的元素时，只有我的第二个示例的语法有效。非常好。感谢您的帮助：）+1表示“事件委派”。始终使用未动态创建的最近的父元素。事件委派对于重复附加了相同处理程序的元素（例如，
$（“表”）。在（“单击”，“td”，函数…）上
可能比在每个单独的td上注册一个事件处理程序要好——尽管我不太明白如何解释它。很高兴知道绑定到动态元素比我想象的要容易得多。谢谢。@wrschneider99:完全正确，我不会进入使用
$（文档）的习惯
但正如文章中所述，请使用最近的现有元素。感谢再次突出显示此内容。
$(document).on("click", ".bar", function() {
    console.log("bar clicked");
});