javascript - 在 jquery ui date-picker 中如何允许选择特定的工作日并禁用其他工作日

Question

我需要将 jquery ui 日期选择器限制为仅将未来的星期二和星期四作为可选日期。

我怎样才能做到这一点？

Answer 1

这一切都在文档中。beforeShowDay 函数会做你想做的事。

http://api.jqueryui.com/datepicker/#option-beforeShowDay

我的使用是不同的日子，但我最终在 beforeShowDay 调用我的 limitdays 函数

function limitDays(date){

var day = date.getDay();

  // Only make Mon, Tues, and Thurs selectable
  if(day == 1 || day == 2 || day == 4){
    return [true, ''];
  }else{
    return [false, ''];
  }
}

Answer 2

为日期选择器提供一个 onSelect 处理程序，并让您的处理程序验证日期是否符合您定义的标准。我不确定 onSelect 在哪里触发，因此如果您无法停止事件并提醒用户，您可能会“撤消”选择。

一种方法是开发一个自定义日期验证器类，该类接受参数，然后从 onSelect 函数调用该日期验证器。onSelect 函数可以处理与日期选择器本身的交互以保持设计简洁。

来自http://docs.jquery.com/UI/Datepicker/datepicker#options

$("div.selector").datepicker({ 
  onSelect: function(dateText) { 
    alert(dateText);
  } 
})

要更改特定日期或日期集的显示和可选择性，请使用 beforeShowDay 处理程序并让它更改相关日期的可选择性和 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, ''];
}