如何在JavaScript的datepicker中禁用过往日期？

嘿，这事儿超容易解决！只要在你现有的datepicker配置里加一个参数就能搞定。先理清楚你的现有代码：

你的现有HTML代码 #

<input type="text" required name="date_from" class="mydate input-text full-width" placeholder="Departure Date" />

（小提醒：你原来的HTML里重复写了name="date_from"，建议删掉其中一个，避免冗余）

你的现有脚本代码 #

<script type="text/javascript"> 
  $(".mydate").datepicker({ 
    format:'yyyy-mm-dd', 
    autoclose: true 
  }); 
  $(".flexslider").flexslider({ 
    animation: "fade", 
    // 你的其他flexslider配置内容...
  });
</script>

修改后的代码（添加禁用过往日期的核心配置） #

只需要在datepicker的配置对象里新增startDate: new Date()这一行，它会把可选日期的起始点设置为今天，所有过去的日期就会被自动禁用，无法选择了：

<script type="text/javascript"> 
  $(".mydate").datepicker({ 
    format:'yyyy-mm-dd', 
    autoclose: true,
    startDate: new Date() // 核心配置：禁用过往日期
  }); 
  $(".flexslider").flexslider({ 
    animation: "fade", 
    // 你的其他flexslider配置内容...
  });
</script>

额外灵活配置技巧 #

如果你的需求不是从今天开始，还可以调整startDate的值适配不同场景：

• startDate: "+1d"：从明天开始，禁用今天及过往日期
• startDate: "-3d"：允许选择最近3天内的日期（包括今天）
• startDate: "2024-05-01"：从指定的具体日期开始，之前的日期全部禁用

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