如何用jQuery UI DatePicker统计选中日期当月已过工作日数？

要实现选中日期当月内之前的工作日统计，核心思路是遍历当月1号到选中日期的每一天，逐个判断是否为工作日（非周末+不在假期列表），具体实现如下：

1. 准备基础数据与工具函数 #

先定义自定义假期列表（日期格式统一为YYYY-MM-DD），再写一个判断某一天是否为工作日的工具函数：

// 自定义假期列表（替换成你的实际假期数据）
const holidayList = ['2025-01-01', '2025-01-08', '2025-01-14', '2025-01-15'];

// 判断指定日期是否为工作日
function isWorkDay(date) {
  const dateStr = date.toISOString().split('T')[0];
  const dayOfWeek = date.getDay(); // 0=周日，6=周六
  // 非周末且不在假期列表中，即为工作日
  return dayOfWeek !== 0 && dayOfWeek !== 6 && !holidayList.includes(dateStr);
}

2. 统计选中日期当月之前的工作日数量 #

写一个统计函数，从当月第一天开始遍历到选中日期，累加符合条件的工作日数量：

function countWorkDaysBeforeSelected(selectedDate) {
  const targetDate = new Date(selectedDate);
  // 定位到当月第一天
  const startDate = new Date(targetDate.getFullYear(), targetDate.getMonth(), 1);
  
  let workDayCount = 0;
  // 逐天遍历，判断是否为工作日并计数
  for (let date = new Date(startDate); date <= targetDate; date.setDate(date.getDate() + 1)) {
    if (isWorkDay(date)) {
      workDayCount++;
    }
  }
  
  return workDayCount;
}

3. 结合jQuery UI DatePicker使用 #

在DatePicker的onSelect事件中调用统计函数，获取结果：

$(function() {
  $("#datepicker").datepicker({
    // 已有的禁用周末和假期的配置
    beforeShowDay: function(date) {
      const dateStr = date.toISOString().split('T')[0];
      const isWeekend = date.getDay() === 0 || date.getDay() === 6;
      const isHoliday = holidayList.includes(dateStr);
      return [!isWeekend && !isHoliday];
    },
    // 选中日期时触发统计
    onSelect: function(selectedDateStr) {
      const selectedDate = new Date(selectedDateStr);
      const workDayCount = countWorkDaysBeforeSelected(selectedDate);
      console.log(`当月选中日期前的工作日数量：${workDayCount}`);
      // 可将结果渲染到页面，比如：
      // $("#result").text(`工作日数量：${workDayCount}`);
    }
  });
});

关键说明 #

• 日期格式统一：所有判断都用YYYY-MM-DD格式，避免时区或日期对象差异导致的错误。
• 循环逻辑：通过setDate(date.getDate() + 1)逐天递增，确保遍历每一个日期，无遗漏或重复。
• 逻辑复用：beforeShowDay的禁用逻辑可以和isWorkDay函数复用，减少代码冗余。

比如你例子中选中1月20日，遍历1号到20号后，就能得到排除周末和指定假期后的工作日总数。

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