javascript - bootstrap datepicker，beforeShowDay 在第二次点击后起作用

Question

我在引导日期选择器的 beforeShowDay 函数方面遇到一些问题。我的意图是当我点击任何一天时，所选日期之后的 5 天必须包含事件类。

当页面加载时，该功能完美运行。但是，当我尝试选择任何其他日期时，如果我希望该功能正常工作，我必须双击。该功能必须单击 1 次才能工作。有什么问题吗？

var selectedDay = new Date().getTime();
$('.datepicker').datepicker({
    beforeShowDay: function (date) {
        var d = date.getTime();
        if (d > selectedDay && d < selectedDay + 1 + 86400000 * 5) {
            return {classes: 'active'};
        }
    },
    startDate: '0'
}).on('changeDate', function(e){
    selectedDay = e.date;
    selectedDay = selectedDay.getTime(); 
});

Answer 1

我知道这是一个老问题，但今天它仍然发生在 Bootstrap 的日期选择器中。原因是 beforeshowday 在 changeDate 之前触发。因此，每次点击新的一天后，beforeshowday 首先出现(使用旧日期)，然后 changeDate 发生。不管我怎么看。我觉得这是他们应该修复的错误，因为样式应该适用于新日期。因此，changeDate 应该位于其他任何内容之前。

无论如何，解决方案实际上非常简单。更改日期后，只需在 changeDate 中强制执行update，它就会使用新日期触发 beforeShowDay。这是我的代码片段作为示例:

    $('#datepicker').datepicker({
        inline: true,
        todayHighlight: true,
        beforeShowDay:function hday(date){
            return (is_pay_day() && day_diff(date)<14 && day_diff(date)>0 ) ?  {classes: 'highlight'} : {} ;
        }
    }).datepicker('setDate', 'today').on("changeDate", function (ev) {
        //set the new date if one is selected
        (!ev.date) ? $(this).datepicker('setDate', selectedDate) : selectedDate = ev.date;
        $('#datepickerInput').val(selectedDate.toDateString());
        //force the update, so the beforeShowDay will be triggered 
        $('#datepicker').datepicker('update',selectedDate);
    });