如何在jQuery UI Datepicker中排除周内指定日期（禁选周六周日）

嘿，这个需求其实很简单，咱们用jQuery UI Datepicker自带的beforeShowDay选项就能轻松实现禁止选择周六、周日的效果！

完整可运行代码 #

<!-- 先引入依赖的jQuery和jQuery UI脚本 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<!-- 别忘了加jQuery UI的基础样式，不然日期选择器会很丑哦 -->
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<!-- 你的日期输入框 -->
<input type="text" id="datepicker">

<script>
// 初始化Datepicker并添加周末禁用规则
$( "#datepicker" ).datepicker({
  firstDay: 1, // 保持你原来的设置：周一作为一周第一天
  minDate: 5,  // 保持你原来的设置：只能选5天后的日期
  beforeShowDay: function(date) {
    // 获取当前日期对应的星期数字：0=周日，1=周一，……6=周六
    const dayOfWeek = date.getDay();
    // 返回数组：第一个元素是布尔值，true=可选择，false=不可选择；第二个是自定义CSS类（这里留空就行）
    return [(dayOfWeek !== 0 && dayOfWeek !== 6), ''];
  }
});
</script>

核心逻辑说明 #

• beforeShowDay是Datepicker的核心回调函数，它会对每个即将显示的日期单独执行一次，用来判断这个日期能不能被选择。
• 我们用date.getDay()拿到日期对应的星期数，然后通过dayOfWeek !== 0 && dayOfWeek !== 6排除掉周日（0）和周六（6），只允许周一到周五被选择。
• 如果之后你需要禁用特定节假日，也可以在这个函数里扩展逻辑——比如把要禁用的日期存进数组，然后判断当前日期是否在数组里就行。

内容的提问来源于stack exchange，提问作者Andi Crew