Question

我正在使用以下代码在加载页面时在日期文本字段中显示日期或预加载日期。

$(function() {
    $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd"
    }).datepicker("setDate", "0");
});

但我想跳过星期六和星期日的周末日显示/预先显示日期字段。

请帮助！

Answer 1

有beforeShowDay选项，它为每个日期调用一个函数，如果允许日期则返回true，否则返回false。来自文档：

<强> beforeShowDay

该函数将日期作为参数，并且必须返回一个数组，其中[0]等于true / false，指示此日期是否可选，1等于CSS类名称或''作为默认值介绍。在显示日期选择器之前，它会在每天被调用。

在日期选择器中显示一些国家法定假日。

$(".selector").datepicker({ beforeShowDay: nationalDays})   

natDays = [
  [1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'],
  [4, 27, 'za'], [5, 25, 'ar'], [6, 6, 'se'],
  [7, 4, 'us'], [8, 17, 'id'], [9, 7, 'br'],
  [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']
];

function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
      if (date.getMonth() == natDays[i][0] - 1
          && date.getDate() == natDays[i][1]) {
        return [false, natDays[i][2] + '_day'];
      }
    }
  return [true, ''];
}

存在一个内置函数，称为noWeekends，它阻止选择周末日。

$(".selector").datepicker({ beforeShowDay: $.datepicker.noWeekends })
To combine the two, you could do something like (assuming the nationalDays function from above):

$(".selector").datepicker({ beforeShowDay: noWeekendsOrHolidays})   

function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
        return nationalDays(date);
    } else {
        return noWeekend;
    }
}

更新：请注意，从jQuery UI 1.8.19开始，beforeShowDay选项也接受可选的第三个参数，一个弹出工具提示

您也可以将其用于假期

Answer 2

根据我的理解，你不想显示周末日期。

从datePicker获取当前日期。
使用date.getUTCDay()检查星期几。
实施一个简单的if..else..条件来检查当天。
.datepicker("destroy") 会从附加的元素中删除datepicker。

$(function () {
    $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd"
    }).datepicker("setDate", "0");
    date = $("#datepicker").datepicker('getDate');
    var day = date.getUTCDay();
    if ((day == 0) || (day == 5)) {
        $('#datepicker').val('');  // reset the value of text fields
        $("#datepicker").datepicker("destroy"); //detach datepicker from element
    }
});

注意：getUTCDay 根据通用时间返回指定日期的星期几，其中0代表星期日。

使用日期填充文本框但不在JQuery日期选取器中显示周末

2 个答案: