jQuery UI Datepicker - How can i, on select, highlight a particular range of dates?

后端 未结 1 898
滥情空心
滥情空心 2021-02-10 09:33

I want to, when the user selects a date, highlight the following 11 days. The intention is to show a 12-day range selected depending on whatever day was chosen.

I\'ve se

1条回答
  •  梦毁少年i
    2021-02-10 10:03

    You can use the beforeShowDay event to give a CSS style for the dates you need to highlight.

    Code:

    $(document).ready(function(){
        var selected = null;
    
        $('#datePicker').datepicker({beforeShowDay: function(date) {
                            if (selected != null && date.getTime() > selected.getTime() &&
                                (date.getTime() - selected.getTime()) < 12*24*3600*1000) {
                                return [true, "highlighted"];
                            }
                            return [true, ""];
                        }});
    
        $("#datePicker").datepicker( 'option' , 'onSelect', function() {
                str = $(this).val().toString();
                selected=$.datepicker.parseDate('mm/dd/yy', str);
                console.log(selected);
                });
    });
    

    0 讨论(0)
提交回复
热议问题