在 jquery ui date-picker 中如何允许选择特定工作日并禁用其他工作日 [英] In jquery ui date-picker how to allow selection of specific weekdays and disable the other weekdays

查看:25
本文介绍了在 jquery ui date-picker 中如何允许选择特定工作日并禁用其他工作日的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I need to limit the jquery ui date picker to only have future Tuesdays and Thursdays as selectable days.

我怎样才能做到这一点?

How can I accomplish this?

推荐答案

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

Provide an onSelect handler to the datepicker and have your handler validate that the dates fit your defined criteria. I'm not sure where the onSelect fires so you may have "undo" the selection if you can't stop the event and alert the user.

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

One way of doing this would be to develop a custom date validator class that takes parameters and then call that date validator from the onSelect function. The onSelect function could take care of interacting with the datepicker itself to keep the design clean.

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

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

要更改特定日期或一组日期的显示和可选性,请使用 beforeShowDay 处理程序并让它更改相关日期的可选性和 CSS.

To change the display and selectability of a particular date or set of days use a beforeShowDay handler and have it change the selectability and CSS for the date in question.

$(".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, ''];
}

这篇关于在 jquery ui date-picker 中如何允许选择特定工作日并禁用其他工作日的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆