Bootstrap Datepicker - 月份和年份没有间距答案

【问题标题】：Bootstrap Datepicker - Months and Years have no spacingBootstrap Datepicker - 月份和年份没有间距
【发布时间】：2021-10-05 05:49:15
【问题描述】：

我正在使用来自 http://eternicode.github.io/bootstrap-datepicker/ 的 Bootstrap 日期选择器，在示例中，他们展示了它的格式，并以网格样式很好地显示了月份和年份之间的间距。

但是使用他们的 js 和 css 文件，月份和年份都显示在一起，请参阅下面的图片作为参考。

为了正确显示，我是否缺少任何选项或东西。

谢谢

西蒙

【问题讨论】：

标签： javascript jquery css twitter-bootstrap datepicker

【解决方案1】：

检查您的控制台中是否没有 javascript 错误。也许您的脚本中还有其他东西会破坏日期选择器。如果没有错误，请确保 boostrap 的 JS 和 CSS 文件都正确加载。希望它有效！

尼克

【讨论】：

Simon，您能否说明这是如何解决的。我有同样的问题。控制台中没有错误。 “糟糕的订购”是什么意思？
@Davy 检查您的文件是否以正确的顺序加载。请参阅文档here 以确保所有文件的顺序正确。

【解决方案2】：

在页面上使用以下脚本，假设您的输入字段名称为 dob 并使用 id="date" type="text"：

$(document).ready(function(){
    var date_input=$('input[name="dob"]'); 
    var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
    date_input.datepicker({
        format: 'dd/mm/yyyy',
        container: container,
        todayHighlight: true,
        autoclose: true,
    })
})

【讨论】：

【解决方案3】：

我在 2021 年使用 Bootstrap 5 和 Datapicker 1.9 版遇到了同样的问题

我在 CSS 或页面本身中添加了这个样式指令，因为年份和几十年都在一个跨度内，嵌入在一个表格行中，该行本身就在一个 div 中（不是真正的“提升思维”，但日期选择器现在可能是比核心 Boostrap 框架更老...）。

<style>
    div.datepicker-years span{
         margin-left: 5px; 
         margin-right: 5px; 
    }
</style>

在您方便时修改指令（此示例仅适用于年份屏幕）。

【讨论】：