引导日期选择器禁用 css 不起作用

Question

我正在使用bootstrap datepicker。我已将 datepicker 的 minimum date 设置为 current date。它工作正常，我可以选择仅从当前日期开始的日期。问题是虽然以前的日期被禁用，但用户无法区分活动日期和禁用日期（他只能通过将鼠标悬停在相应的日期上来做到这一点）。

如何将禁用日期设置为fade，以便用户只需选择日期选择器即可理解。

 $('.dueDate').datepicker({
        autoclose: true,
        startDate: '+0d', // set default to today's date  
        datesDisabled:??//How can I set this option         
    })

Answer 1

您可以使用startDate 字段来指定您希望日历开始的时间，默认情况下这应该使禁用的日期看起来褪色/不可选择。

您还可以使用daysOfWeekDisabled 禁用一周中的某些天，例如周末。

例如：

 $("#datepicker").datepicker({
     startDate: "dateToday",
     daysOfWeekDisabled: "0,6",
     todayHighlight: true,
 })

---

编辑：

如果这不起作用，则可能是您的 css 有问题。

您可以在下面添加类似这样的内容（默认情况下应该在您的 bootstrap-datepicker3.css 文件中）：

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  background: none;
  color: #999999;
  cursor: default;
}

Answer 2

你可以用这个

var nowDate = new Date();
var today = new Date(
    nowDate.getFullYear(),
    nowDate.getMonth(),
    nowDate.getDate(), 0, 0, 0, 0
);

$('#date').datepicker(
    { 
        startDate: today 
    }
);