bootStrap datepicker 周六周日背景色设置
时间: 2023-10-01 11:06:52 浏览: 124
更改DateTimePick控件背景色
4星 · 用户满意度95%
可以使用 Bootstrap Datepicker 提供的 `beforeShowDay` 选项来设置周六周日的背景色。具体操作如下:
1. 在引入 Bootstrap Datepicker 的代码之后,引入以下代码:
```javascript
// 设置周六周日的背景色
$(document).ready(function () {
$('#datepicker').datepicker({
beforeShowDay: function (date) {
var dayOfWeek = date.getDay();
if (dayOfWeek == 6 || dayOfWeek == 0) {
return {
classes: 'bg-weekend'
};
} else {
return {};
}
}
});
});
```
2. 在 CSS 文件中定义 `bg-weekend` 类的样式:
```css
.bg-weekend {
background-color: #f2dede;
}
```
以上代码中,`#datepicker` 是指你所使用的日期选择器的 ID,`bg-weekend` 是你自定义的类名,可以根据需要进行修改。代码中使用了 `getDay()` 方法来获取当前日期的星期几,星期六和星期日的值分别为 6 和 0,如果当前日期是周六或周日,则返回一个对象,其中 `classes` 属性的值为 `bg-weekend`,表示要显示该日期的背景色。如果不是周六或周日,则返回一个空对象,表示该日期不需要特殊处理。
阅读全文