Bootstrap datepicker - 在特定月份的指定日期添加工具提示
Bootstrap datepicker - adding tooltip on specified date of specific month
工具提示工作正常,
我无法设置特定月份的工具提示的问题,
如果我将工具提示设置为当月的第 5 个日期,但工具提示在每个月的第 5 个日期添加
$('.date-header').datepicker({
autoclose: true,
beforeShowDay: function(date) {
var hilightedDays = [5,6];
if (~hilightedDays.indexOf(date.getDate()) && ( hilightedDays) ) {
return {classes: 'highlight', tooltip: 'Example Tooltip data' }
}}
}).on('show',function(e, date) {
$('td.highlight').tooltip();
});
没有提交输入,因为我在这里没有选择任何日期,只是将信息添加为 tooltop
<div class="calendar-block ">
<span class="date-header calendar--btn d-flex text-center align-items-center "><i class="far fa-calendar-alt"></i></span>
</div>
是否可以添加日期选择器在单击日历按钮时显示切换样式
如果您只想将日期应用到当前月份,您可以获取该值并检查在日期选择器中查看的月份是否等于当前月份。
像这样:
$('.date-header').datepicker({
autoclose: true,
beforeShowDay: function(date) {
var hilightedDays = [5, 6];
// get current month
var currentMonth = new Date().getMonth();
// if date.getMonth() === currentMonth, then highlight the date
if (date.getMonth() === currentMonth && ~hilightedDays.indexOf(date.getDate()) && (hilightedDays)) {
return {
classes: 'highlight',
tooltip: 'Example Tooltip data'
}
}
}
})
同样,您可以使用任何月份值(例如,如果您只想在九月显示工具提示,只需检查月份是否 === 8;月份是基于 0 的,因此 0 是一月,11 是十二月)。
已更新 Fiddle:https://jsfiddle.net/bt0hysqm/
工具提示工作正常, 我无法设置特定月份的工具提示的问题,
如果我将工具提示设置为当月的第 5 个日期,但工具提示在每个月的第 5 个日期添加
$('.date-header').datepicker({
autoclose: true,
beforeShowDay: function(date) {
var hilightedDays = [5,6];
if (~hilightedDays.indexOf(date.getDate()) && ( hilightedDays) ) {
return {classes: 'highlight', tooltip: 'Example Tooltip data' }
}}
}).on('show',function(e, date) {
$('td.highlight').tooltip();
});
没有提交输入,因为我在这里没有选择任何日期,只是将信息添加为 tooltop
<div class="calendar-block ">
<span class="date-header calendar--btn d-flex text-center align-items-center "><i class="far fa-calendar-alt"></i></span>
</div>
是否可以添加日期选择器在单击日历按钮时显示切换样式
如果您只想将日期应用到当前月份,您可以获取该值并检查在日期选择器中查看的月份是否等于当前月份。
像这样:
$('.date-header').datepicker({
autoclose: true,
beforeShowDay: function(date) {
var hilightedDays = [5, 6];
// get current month
var currentMonth = new Date().getMonth();
// if date.getMonth() === currentMonth, then highlight the date
if (date.getMonth() === currentMonth && ~hilightedDays.indexOf(date.getDate()) && (hilightedDays)) {
return {
classes: 'highlight',
tooltip: 'Example Tooltip data'
}
}
}
})
同样,您可以使用任何月份值(例如,如果您只想在九月显示工具提示,只需检查月份是否 === 8;月份是基于 0 的,因此 0 是一月,11 是十二月)。
已更新 Fiddle:https://jsfiddle.net/bt0hysqm/