快速添加复选框jQuery UI datepicker的方法

Question

我想添加复选框＆＃34;没有结束日期＆＃34;到我的日期选择器小部件的末尾。我看到人们使用＆＃34; beforeshow＆＃34;在datepicker下的方法，但它似乎没有工作。 这就是我所拥有的。

$("#to").datepicker({
    dayNamesMin: ["S", "M", "T", "W", "T", "F", "S"],
    firstDay: 1,
    dateFormat: "d MM, yy",
    onClose: function (selectedDate) {
        $("#from").datepicker("option", "maxDate", selectedDate);
    },
    beforeShow: function (input, inst) {
        setTimeout(function () {
            var buttonPane = $(input)
                .datepicker("widget")
                .find(".ui-datepicker-buttonpane");
            var html = '<div class="noEndDate"><input type="checkbox"><label> No End Date </label></div>';
            buttonPane.append(html);
        }, 10);

    }
});

Answer 1

您必须设置datepicker的按钮面板才能使用var buttonPane = $(input).datepicker("widget").find(".ui-datepicker-buttonpane");定位它：

showButtonPanel: true,

但是，正如您的图像所暗示的那样，您不需要按钮面板，因此请改用：

var buttonPane = $(input).datepicker("widget");

DEMO