具有多个链接的 jQuery 事件处理程序将不起作用

Question

我正在尝试附加jQuery ui-datepicker，而我无法让活动处理程序工作：

$( '.ui-datepicker' ).on('click', 'a.ui-datepicker-next', 'a.ui-datepicker-prev', function( event ) {
    event.preventDefault();
        console.log("CLICK");
});

单击链接时，我没有登录控制台。这是HTML：

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"...>
    <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix- ui-corner-all">
        <a class="ui-datepicker-next ui-corner-all"...></a>
        <a class="ui-datepicker-prev ui-corner-all"...></a>
        ...

在活动处理程序中我需要放置什么才能触发这一点？jQuery位于我的HTML的页脚中的<script>jQuery here</script>中。

编辑：链接不正确-a.ui-datepicker-month和a.ui-datepicker-year 更改为 a.ui-datepicker-next和a.ui-datepicker-prev

谢谢

Answer 1

您的语法不太正确。选择器需要进行逗号界定，但在同一字符串中。尝试以下操作：

$('.ui-datepicker').on('click', 'a.ui-datepicker-month, a.ui-datepicker-year', function(e) {
  e.preventDefault();
  console.log("CLICK");
});

注意：'a.ui-datepicker-month, a.ui-datepicker-year'。还请注意使用e，而不是event，因为这将覆盖某些浏览器具有的全局事件对象。

*编辑问题后的更新：

还有其他两个问题。首先，正确的类是a.ui-datepicker-prev和a.ui-datepicker-next。另外，ui.-datepicker元素在DOM的负载上不存在，因此没有任何可以将事件绑定到的。为了解决此问题，您可以使用$(document)，尽管理想情况下，您应该将最近的父元素与要定位的元素一起使用Load On Load中的DOM。尝试以下操作：

$(document).on('click', 'a.ui-datepicker-prev, a.ui-datepicker-next', function(e) {
  e.preventDefault();
  console.log("CLICK");
});

工作示例