如何将365位日期状态字符串传入Moment.js日期范围选择器禁用指定日期？

核心步骤 #

1. 确定状态字符串对应的起始日期
   365位字符串对应连续365天，你需要先明确这个序列的起始日期（比如当年1月1日，或是API返回的基准日期）。这里我们以当年1月1日作为起始点，用Moment.js快速生成对应日期。

2. 预处理状态数据
   将API返回的365位字符串拆分为单个字符的数组，方便按日期偏移量直接获取对应状态。

3. 利用日期选择器的禁用判断回调
   基于Moment.js的日期范围选择器提供了isInvalidDate回调函数，我们可以在这个函数里判断当前日期是否属于预留（1）或已预订（2）状态，从而禁用该日期。

完整代码示例 #

// API返回的状态字符串
const statusString = "11422222224000000000000000000011111114000000000000000000000000000000000000000000000000000000000000000000000000000000000000000111111111111400000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000";
// 转换为状态数组，便于按索引取状态
const statusArray = statusString.split('');

// 设置起始日期（可根据实际业务调整为API指定的基准日期）
const startDate = moment().startOf('year');

// 初始化日期范围选择器
$('input[name="daterange"]').daterangepicker({
  isInvalidDate: function(date) {
    // 计算当前日期与起始日期的天数偏移量
    const dayOffset = date.diff(startDate, 'days');
    
    // 偏移量超出365天范围时，直接禁用（可选，根据需求调整）
    if (dayOffset < 0 || dayOffset >= 365) {
      return true;
    }
    
    // 获取当前日期对应的状态
    const status = statusArray[dayOffset];
    
    // 状态为1（已预留）或2（已预订）时，禁用该日期
    return status === '1' || status === '2';
  },
  // 其他配置项可按需添加，比如日期格式、可选范围等
  locale: {
    format: 'YYYY-MM-DD'
  }
});

注意事项 #

• 起始日期校准：如果API返回的状态序列起始日期不是当年1月1日，必须修改startDate为正确的基准日期，确保偏移量计算准确。
• 异常处理：如果状态字符串长度不足365位，建议添加校验逻辑，避免数组越界错误。
• 特殊状态处理：你的示例字符串中出现了4，如果这是无效状态，可在判断逻辑中统一按禁用或忽略处理，具体依业务规则调整。

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