日期選擇器跳過禁用日 Javascript

Question

我想跳過禁用日期。

工作：代碼可以跳過來自數組的日期：

var disabledDates = ["2020-08-07","2020-08-06"] <br />

不工作：代碼不會跳過禁用的日子：

var day = day.getDay();
var monday = 1;

工作jsfiddle： http : //jsfiddle.net/9Lfjdh54/4/

 var disabledDates = ["2020-08-07", "2020-08-06"] $("#picker").datepicker({ beforeShowDay: function(day) { const string = jQuery.datepicker.formatDate('yy-mm-dd', day); var day = day.getDay(); var monday = 1; if (day != monday) { return [true] && [disabledDates.indexOf(string) == -1] } else { return [false] } } }); $('.next-day').on("click", function() { var date = $('#picker').datepicker('getDate'); do { date.setTime(date.getTime() + (1000 * 60 * 60 * 24)); var string = jQuery.datepicker.formatDate('yy-mm-dd', date); } while (disabledDates.indexOf(string) >= 0); $('#picker').datepicker("setDate", date); }); $('#picker').datepicker();

 <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> <div id="picker"></div> <br/><br/> <button class="next-day">Next</button>

Answer 1

星期一下的日子不會被跳過

更具體地說，單擊第二天按鈕時不會跳過這些。

由於下一個按鈕不使用日期選擇器來確定哪些日期可用，因此需要在下一個按鈕中重用用於禁用日期的相同邏輯。

簡單來說，這意味着添加星期一檢查：

   var day = date.getDay();
   var monday = 1;
 }
 while (disabledDates.indexOf(string) >= 0 || day==monday);

更新小提琴： http : //jsfiddle.net/xjq63mv2/

 var disabledDates = ["2020-08-07", "2020-08-06"] $("#picker").datepicker({ beforeShowDay: function(day) { var string = jQuery.datepicker.formatDate('yy-mm-dd', day); var day = day.getDay(); var monday = 1; if (day != monday) { return [true] && [disabledDates.indexOf(string) == -1] } else { return [false] } } }); $('.next-day').on("click", function() { var date = $('#picker').datepicker('getDate'); do { date.setTime(date.getTime() + (1000 * 60 * 60 * 24)); var string = jQuery.datepicker.formatDate('yy-mm-dd', date); var day = date.getDay(); var monday = 1; } while (disabledDates.indexOf(string) >= 0 || day == monday); $('#picker').datepicker("setDate", date); }); $('#picker').datepicker();

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> <div id="picker"></div> <br/><br/> <button class="next-day">Next</button> <button class="prev-day">Previous</button>