Pikaday - 标记或突出某些日期答案

【问题标题】：Pikaday - mark or highlight certain datesPikaday - 标记或突出某些日期
【发布时间】：2015-10-03 02:18:36
【问题描述】：

我正在使用 pikaday，它确实是不错的日期选择器。是否有可能标记或突出某些日期？乍一看，这可以帮助用户区分“常规”日期和一些“重要”日期。

【问题讨论】：

标签： javascript datepicker pikaday

【解决方案1】：

您可以将日期数组添加到events 属性：

您希望与常规日期区分开来的事件数组（例如 ['Sat Jun 28 2017'、'Sun Jun 29 2017'、'Tue Jul 01 2017'、]）

https://github.com/dbushell/Pikaday#configuration

【讨论】：

此配置参数在 Pikaday 中不起作用

【解决方案2】：

另一个可行的解决方案，使用 CSS 选择器：

  [data-pika-year="2019"][data-pika-month="0"][data-pika-day="8"] {background-color: $golden-rod!important; color:#666!important}
  [data-pika-year="2019"][data-pika-month="0"][data-pika-day="9"] {background-color: $golden-rod!important; color:#666!important}
  [data-pika-year="2019"][data-pika-month="0"][data-pika-day="10"] {background-color: $golden-rod!important; color:#666!important}
  [data-pika-year="2019"][data-pika-month="0"][data-pika-day="12"] {background-color: $golden-rod!important; color:#666!important}
  [data-pika-year="2019"][data-pika-month="0"][data-pika-day="15"] {background-color: $old-rose!important; color:#FFF!important}

使用“events”属性在按钮上附加“has-event”类。来自代码：

hasEvent = opts.events.indexOf(day.toDateString()) !== -1 ? true : false
...
if (opts.hasEvent) {
    arr.push('has-event');
}

【讨论】：