在您更改月份之前，showday 之前的内联日期选择器不会触发

Question

我已经阅读了几个关于内联日期选择器和 beforeshowday 问题的类似问题，但我还没有找到针对我的特定问题的确切解决方案。

我有一个函数 available 可以设置某些可用日期，但它不会运行直到您实际更改月份。

$( function() {

        $( "#whats-on-calendar" ).datepicker({
            numberOfMonths: 3,
            dateFormat: "dd/mm/yy",
            beforeShowDay: available,
            todayHighlight: true
        });

        var availableDates = ["9-9-2018","14-9-2018","15-9-2018"];

        function available(date) {
            dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
            if ($.inArray(dmy, availableDates) != -1) {
                return [true, "","Available"];
            } else {
                return [false,"","unAvailable"];
            }
        }
    } );

https://jsfiddle.net/kwjxv5ot/4/

我在文档中读到要在初始化后设置选项，您需要使用 option() 方法。

$("#whats-on-calendar").datepicker('option', 'beforeShowDay', available);

但这给了我同样的问题。在我更改月份之前它不会触发。

Answer 1

你应该在初始化日期选择器之前声明该方法，否则它将是未定义的。

$( function() {
    var availableDates = ["9-9-2018","14-9-2018","15-9-2018"];
    function available(date)
    {
        dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
        return [$.inArray(dmy, availableDates) != -1]
    }
    $( "#whats-on-calendar" ).datepicker({
        numberOfMonths: 3,
        dateFormat: "dd/mm/yy",
        beforeShowDay: available,
        todayHighlight: true
    });
} );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div id="whats-on-calendar"></div>

在您更改月份之前，showday 之前的内联日期选择器不会触发

Inline datepicker beforeshowday won't fire until you change the month

jquery

datepicker

jquery-ui-datepicker