javascript - 日期选择器中突出显示日期的问题
问题描述
我正在尝试使用已知代码突出显示日期,但我需要一些帮助,因为日期没有突出显示。
var highlightdate = ["2020-06-19", "2020-06-20", "2020-06-26", "2020-06-25", "2020-06-30"];
var date = new Date();
jQuery(document).ready(function() {
$( "#datepicker").datepicker({
dateFormat: 'yy-mm-dd',
beforeShowDay: function(date) {
var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
for (i = 0; i < highlightdate.length; i++) {
if($.inArray(y + '-' + (m+1) + '-' + d,highlightdate) != -1) {
return [true, 'highlighdate', ''];
}
}
return [true];
}
});
});
.highlightdate {
background-color: #ff0;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<link href = "https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css"
rel = "stylesheet">
<script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<div id="datepicker"></div>
解决方案
您还可以$.datepicker.formatDate( format, date, options )
按照文档使用:https ://api.jqueryui.com/datepicker/
示例代码。
jQuery(function($) {
var dates = ["2020-06-19", "2020-06-20", "2020-06-26", "2020-06-25", "2020-06-30"];
$("#datepicker").datepicker({
dateFormat: 'yy-mm-dd',
beforeShowDay: function(dt) {
var dText = $.datepicker.formatDate("yy-mm-dd", dt);
var result = [true, "", ""];
if (dates.indexOf(dText) >= 0) {
result = [true, 'ui-state-highlight', ''];
}
return result;
}
});
});
.ui-state-highlight>a.ui-state-default {
background: #ffe45c;
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="datepicker"></div>
推荐阅读
- python - 如何区分在Django中以一个表单提交的多个表单?
- c# - 模型详细信息显示在视图上的文本中 - 如何停止显示文本?
- azure-active-directory - 获取仅限于请求应用程序的用户的应用程序角色
- ruby-on-rails - 如何阻止门卫重定向,而是向我显示 oauth/authorize 视图?
- javascript - 如何使用 React 路由将状态从父组件传递到子组件?
- java - 在 Java 程序中运行可执行 JAR 后如何删除它?
- django - Django 从一个视图重定向到另一个 WITH PARAMETERS
- php - 升级到 php8 后 Composer 版本锁定问题
- python-3.x - 将空格分隔的数据添加到从 tkinter 中的输入框读取的列表中
- python - 为什么我不能在 Ubuntu 20.04 LTS 中使用 Pyautogui?