Javascript 单击链接时是否显示日期选择器？

我有一个链接，我想在单击它时显示一个日期选择器：

$('body').on("click", ".date-link", function (e) {
    /*
    $("#daterange").dialog("option", "position",
           {
               my: "left top",
               at: "left bottom",
               of: e,
           });

    $("#daterange").dialog('open');
    */

    $(e).datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        onSelect: function (dateText) {
            changeCalendarDate(dateText);
        },
        onClose: function (dateText) {
        }
    });

    $("#filter").dialog('close');
});

我还希望它在单击任何文档元素时自动关闭，除非用户选择自动关闭的日期

---

谢谢

您可以在click处理程序之外设置datepicker实例。然后单击链接时，只需在设置日期选择器的元素上调用

.datepicker（'show'）

以下是一个简化的示例：

HTML

<input id="date" />
<a href="#" class="date-link">Date Link</a>

---

在上面的代码中，您试图调用事件对象。应该在表示应该触发它的DOM元素（通常是输入）的jQuery对象上调用它。

$("#date").datepicker({
    beforeShowDay: $.datepicker.noWeekends,
    onSelect: function (dateText) {
        changeCalendarDate(dateText);
    }
});

$('.date-link').on('click', function(e) {
    // Do not follow link
    e.preventDefault();
    // Show the datepicker
    $('#date').datepicker('show');
});

function changeCalendarDate(dateText) {
    // Process date
    console.log(dateText);
}