日期选择器下一步单击事件

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

jquery datepicker将事件添加到下一个和上一个按钮

但我不明白的原因是：

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

工作但是：

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

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

这称为event delegation ，在DOM已经呈现之后将项目添加到DOM时使用它。

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

因此，您不需要使用$(document)作为锚点，但是您需要使用在呈现DOM时存在的元素。

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

进一步阅读：

来自jQuery API文档：

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

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

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