Question

我正在使用pikaday，这是非常不错的日期选择器。是否有可能标记或突出某些日期？这可以帮助用户乍看之下将“常规”日期与某些“重要”日期区分开来。

Answer 1

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

您希望与常规日期区分开的日期数组（例如[＆＃39; 2017年6月28日星期六＆＃39;，＆＃39; 2017年2月29日星期日＆＃39;＆＃39;星期二01月01日2017＆＃39;，]）

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

Answer 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');
}

Pikaday - 标记或突出显示某些日期

2 个答案: