Bootstrap-Selectpicker：使不可点击的年份不可见并直接显示选定年份答案

【问题标题】：Bootstrap-Selectpicker: Make non-clickable years invisible and show directly given year as selectedBootstrap-Selectpicker：使不可点击的年份不可见并直接显示选定年份
【发布时间】：2016-08-22 10:26:14
【问题描述】：

以下代码块：

$(".datepicker").datepicker( {
  format: ' yyyy', // Notice the Extra space at the beginning
  viewMode: 'years',
  minViewMode: 'years',
  startDate: '-100y',
  endDate: '-17y'
});

输出：

我有 2 个问题：

如何使不可点击的年份不可见？

如果用户在输入字段中键入年份，然后单击此输入字段，则所选年份应显示为已标记。

这将是期望的结果：

目前我正在学习the following API documentation，还没有找到相关的部分。有人能帮我吗？几年前我已经这样做了，但不幸的是我不记得怎么做了。

【问题讨论】：

标签： twitter-bootstrap bootstrap-select bootstrap-selectpicker

【解决方案1】：

我浏览了一下 API，但没有找到这个功能，但是我创建了一个简单的解决方案：

http://jsfiddle.net/m7atu7up/6/

我们只是使用 CSS 来隐藏具有 disabled 类的年份跨度。

.datepicker table tr td span.disabled {
    display: none;
}

要设置所选跨度的样式，我们使用以下选择器：

.datepicker table tr td span.active.active

这个小提琴适用于你的两个问题。

【讨论】：

禁用作品但未选择键入年份，我们可以放弃隐藏功能，我将编辑我的初始问题并将其删除。
如果您输入有效的年份（例如 1999 或 1916），则日期会在日历中被选中，所以我不确定问题出在哪里？（也更新了小提琴）
您可以执行以下步骤吗：1）删除隐藏功能（如上面编辑过的问题）2）单击并输入有效年份，例如1980 在输入字段中。 3) 这个类型的年份应该用黑色 1px 边框勾勒出来。这样我就可以检测到，应该自己修改哪个类。
啊哈好吧，那么问题是您想自己设置所选项目的样式吗？小提琴已更新，现在将检查边框。
我更新了答案中的小提琴，以提供所选年份的样式。您必须自己进行一些调整才能获得想要的外观和感觉。我遇到的一个问题是边框占用空间，所以我们必须用负边距进行补偿，否则日历布局会搞砸。