Question

var check_in = ["Nov Thu 23, 2017","Nov Fri 24, 2017","Nov Mon 27, 2017"];

$('#check-in-date').datepicker({
dateFormat: 'M D d, yy',
beforeShowDay: function(date){
    var string = jQuery.datepicker.formatDate('M D d, yy', date);
    return [ check_in.indexOf(string) == -1 ]
}
});

这是我试过的代码。它工作正常但我的问题是我只能禁用数组日期。但我也想禁用 2017年11月23日 - 2017年11月27日星期一

来自PHP循环的BTW数组日期。

任何人都可以帮帮我。

感谢。

Answer 1

这将支持同一个check_in数组中的单个日期和一对开始/结束日期范围：

var check_in = ["Nov Wed 22, 2017", ["Nov Sat 25, 2017", "Nov Tues 28, 2017"]];

$('#check-in-date').datepicker({
  dateFormat: 'M D d, yy',
  beforeShowDay: function(date) {
    var string = jQuery.datepicker.formatDate('M D d, yy', date);
    for (var i = 0; i < check_in.length; i++) {
      if (Array.isArray(check_in[i])) {
        var from = new Date(check_in[i][0]);
        var to = new Date(check_in[i][1]);
        var current = new Date(string);
        if (current >= from && current <= to) return false;
      }
    }
    return [check_in.indexOf(string) == -1]
  }
});

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Date: <input type="text" id="check-in-date"></p>

<强>更新

基于注释澄清，这将阻止从数组中的第一个条目到最后一个条目的范围，假设它们按时间顺序排序，与提供的输入一样：

var check_in = [
  ["Nov Thu 23, 2017", "Nov Fri 24, 2017", "Nov Mon 27, 2017", "Dec Thu 07, 2017", "Dec Sun 10, 2017", "Dec Sat 16, 2017", "Dec Sat 30, 2017", "Jan Sat 06, 2018", "Jan Wed 10, 2018", "Jan Sun 14, 2018", "Jan Mon 15, 2018", "Jan Mon 22, 2018", "Jan Wed 24, 2018", "Jan Mon 29, 2018", "Feb Fri 02, 2018", "Feb Tue 06, 2018", "Feb Wed 07, 2018", "Feb Mon 12, 2018", "Feb Fri 16, 2018", "Feb Mon 19, 2018", "Mar Fri 02, 2018", "Mar Mon 05, 2018", "Mar Thu 29, 2018", "Apr Mon 02, 2018", "Apr Wed 18, 2018", "Apr Sat 21, 2018"]
];



$('#check-in-date').datepicker({
  dateFormat: 'M D d, yy',
  beforeShowDay: function(date) {
    var current = new Date(jQuery.datepicker.formatDate('M D d, yy', date));
    var from = new Date(check_in[0][0]);
    var to = new Date(check_in[0][check_in[0].length - 1]);
    return [current < from || current > to]
  }
});

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Date: <input type="text" id="check-in-date"></p>

Answer 2

使用一组开始和结束时间戳，并检查日期是否在它们之间。

var check_in = [[1511395200 /* Nov 23 2017 */, 1511827199 /* Nov 27 2017 23:59:59 */]];

$('#check-in-date').datepicker({
    dateFormat: 'M D d, yy',
    beforeShowDay: function(date){
        var timestamp = date.getTime()/1000;
        for (var i = 0; i < check_in.length; i++) {
            if (timestamp >= check_in[i][0] && timestamp <= check_in[i][1]) {
                return false;
            }
        }
        return true;
    }
});

要标记单个日期，请在该日期将日期范围从00:00设置为23:59:59。

Jquery datepicker禁用带范围的多个日期

2 个答案: