bootstrap-datetimepicker限定可选时间范围
时间: 2023-08-13 08:09:04 浏览: 206
bootstrap-datetimepicker
5星 · 资源好评率100%
要限制 Bootstrap Datetimepicker 可选的时间范围,可以使用 `minDate` 和 `maxDate` 选项,这两个选项都可以接受一个日期对象作为值。以下是一个例子,可以限定只能选择从上午 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);
// 初始化 Datetimepicker 插件,并设置起始日期和结束日期
$('#datetimepicker').datetimepicker({
minDate: startTime,
maxDate: endTime,
// 设置每天可选的时间范围
disabledWeekDays: [0, 6], // 禁止选择周日和周六
disabledHours: [0, 1, 2, 3, 4, 5, 6, 7, 8, 19, 20, 21, 22, 23], // 禁止选择指定的小时
stepping: 60, // 只能选择整点
});
```
在上面的代码中,`startTime` 和 `endTime` 分别被设置为 `Date` 类型的对象,并且分别代表可选时间的起始时间和结束时间。然后,在初始化 Datetimepicker 插件时,通过传递这两个选项来限制可选择的时间范围。此外,还使用了 `disabledWeekDays`、`disabledHours` 和 `stepping` 选项来进一步限制可选的时间范围。
阅读全文