bootstrap-datepicker限定可选时间范围
时间: 2023-08-13 12:09:04 浏览: 109
浅谈Bootstrap的DatePicker日期范围选择
要限制 Bootstrap Datepicker 可选的时间范围,可以使用 `startDate` 和 `endDate` 选项,这两个选项都可以接受一个日期对象作为值。以下是一个例子,可以限定只能选择从上午 9 点到晚上 6 点之间的时间:
```javascript
// 设置起始和结束时间
var startTime = new Date();
startTime.setHours(9); // 上午 9 点
startTime.setMinutes(0);
var endTime = new Date();
endTime.setHours(18); // 晚上 6 点
endTime.setMinutes(0);
// 初始化 Datepicker 插件,并设置起始日期和结束日期
$('#datepicker').datepicker({
startDate: startTime,
endDate: endTime,
// 设置每天可选的时间范围
daysOfWeekDisabled: [0, 6], // 禁止选择周日和周六
hoursDisabled: [0, 1, 2, 3, 4, 5, 6, 7, 8, 19, 20, 21, 22, 23], // 禁止选择指定的小时
minuteStep: 60, // 只能选择整点
});
```
在上面的代码中,`startTime` 和 `endTime` 分别被设置为 `Date` 类型的对象,并且分别代表可选时间的起始时间和结束时间。然后,在初始化 Datepicker 插件时,通过传递这两个选项来限制可选择的日期范围。此外,还使用了 `daysOfWeekDisabled`、`hoursDisabled` 和 `minuteStep` 选项来进一步限制可选的时间范围。
阅读全文