无法定位 jQuery 日期选择器中的元素

Question

我在使用插件 WooCommerce Bookings 定位 jQuery ui-datepicker 中的元素时遇到问题。

每次我使用JavaScript定位它时它returns null，所以EventListener不能被执行。

但是，如果我以 jQuery ui-datepicker 之外的任何目标为目标，我实际上可以执行使用 JS 和 jQuery.

创建的事件

第一次遇到这样的事情，感觉很不一般。

有两个片段我用来测试它是否可以识别元素：

jQuery('.hasDatepicker').on('click', function() {
        alert('hi');
});


function showVolunteers() {
        alert("hi");
}

document.querySelector(".hasDatepicker").addEventListener('click', showVolunteers);

这是一个 JS fiddle，其中 HTML 用于日期选择器：https://jsfiddle.net/e5dnru0e/3/

日期选择器嵌套在一个字段集中，我可以定位它所以我想也许我可以尝试使用 jQuery('fieldset div.ui-datepicker') 但这也不起作用。

为了三重检查我使用了正确的选择器我尝试使用一些 CSS 并且 CSS 工作完美，所以我的选择器没有问题。

是否有可能以某种方式限制 jQuery 在此日期选择器中使用。

如有任何帮助或建议，我们将不胜感激。

Answer 1

当您为任何 DOM 元素注册事件时，它应该在注册时出现在 DOM 中。

如果是动态控件（在 DOM 就绪事件后注入 DOM），您可以使用以下 jquery 语法来注册事件。

$(document).on('click','.ui-datepicker', function() {
        alert('hi');
});

上面的代码在 document 上附加了点击事件（它总是出现在 Document ready 上）。 on 函数的第二个参数是 [selector] 即。 .ui-datepicker

您可以在任何其他 DOM 元素上附加点击事件，而不是 document 注册活动时出席。

即

$('.datepicker-container').on('click','.ui-datepicker', function() {
            alert('hi');
    });

无法定位 jQuery 日期选择器中的元素

Can't target elements within jQuery datepicker

javascript

jquery

datepicker

woocommerce

woocommerce-bookings