Question

我需要为jQuery日期选择器上的下一个按钮预先形成一个事件，并从这个答案得到我需要的东西：

但我不明白的原因是：

$(document).on('click', '.ui-datepicker-next', function() {
  // Preform event
};

工作但是：

$(".ui-datepicker-next").on('click', function() {
  // Preform event
};

两次点击后，我的情况不起作用吗？

Answer 1

这称为?- odd_size([1,2,3]). true. ?- odd_size([1]). true. ?- odd_size([1,2]). false.，在DOM已经渲染之后将项目添加到DOM时使用它。

问题是click事件没有绑定到所需的元素，因为稍后该元素将被注入DOM，因此它尚不存在。因此，jQuery必须将click事件绑定到在呈现DOM时实际存在的元素，并使用事件委托（冒泡）在元素注入DOM时捕获事件。

因此，您不需要使用event delegation作为锚点，但是您需要使用渲染DOM时存在的元素。

但是，首先使用$(document)并使代码正常工作，然后（一旦工作），您可以进一步缩小用于捕获事件的元素。

进一步阅读：

Answer 2

委托事件的优势在于它们可以处理来自稍后添加到文档的后代元素的事件。通过选择附加委托事件处理程序时保证存在的元素，您可以使用委派事件来避免频繁附加和删除事件处理程序。

在第一种情况下，处理程序附加到保证存在的document。然后，选择器确保仅在单击.ui-datepicker-next时触发处理程序。

但是，在第二种情况下，没有可用于附加处理程序的对象，因为在处理程序注册时DOM中不存在.ui-datepicker-next。 < / p>