jQuery中的事件委托是什么以及如何使用它

使用javascript中的事件委托, 你可以避免将事件侦听器添加到特定节点；而是将事件侦听器添加到一个父对象。

如果一个父对象中有许多元素, 并且你想处理它们上的事件, 我们将不希望将处理程序绑定到每个元素。相反, 我们将单个处理程序绑定到其父级是一种很好的做法。

动态创建dom对象时, 需要将事件附加到尚不存在但会存在的对象。

通过下面的示例可以很容易地理解它, 一个ajax将被执行并在我们的文档中添加一个带有” myDivision”类的div, 我们希望每次用户单击一个myDivision div时都会发生一些事情。如果在文档准备好后以这种方式声明侦听器：

$(".myDivision").click(function(){
    //Binded event to our .myDivision objects 
});

你会注意到, 当执行ajax调用并将div添加到我们的文档中时, click不会发生任何变化！但为什么 ？

很简单, 当执行click函数时, 不存在类myDivision的对象, 因此不会绑定任何侦听器。

你将使用该类创建一个隐藏的div, 并且侦听器将被绑定, 但是当再次执行ajax调用并将更多的myDivision div添加到DOM时, 它们都不起作用！

因此, 我们需要处理事件委托, 以免为我们在文档中动态添加的每个.myDivision对象添加点击侦听器, 如下所示：

$(document).on("click", ".myDivision", function(){
    //Execute something 
});

事件委托非常容易理解, 将侦听器添加到对象的父容器中, 它将管理所有子目标项的侦听器。