Bootstrap datetimepicker v4.x 12hr 时间不工作答案

【问题标题】：Bootstrap datetimepicker v4.x 12hr time not workingBootstrap datetimepicker v4.x 12hr 时间不工作
【发布时间】：2017-08-01 21:12:15
【问题描述】：

我一直试图让 bootstrap v4.17.47 的 datetimepicker 工作无济于事。当我设置format 时，我只有 24 小时和分钟，我似乎无法获得 12 小时的工作时间。

还有什么需要设置的吗？我在唱 bootstrap v3.3.2 和 jQuery v2.2.3。

<div class="form-group">
    <div class='input-group date' id='TheTime'>
        <input type='text' class="form-control" />
        <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
        </span>
    </div>
</div>

低于我设置的 JavaScript，但我没有收到 12 小时的弹出窗口。使用以下设置，我得到一个 24 小时的弹出窗口，但时间文本框中显示的内容例如：弹出窗口显示 21:00，但文本框显示 9:00 tt。

<script type="text/javascript">
    $(document).ready(function ($) {
        $('#TheTime').datetimepicker({
            format: 'hh:mm tt'
        });                        
    });
</script>

【问题讨论】：

标签： bootstrap-datetimepicker eonasdan-datetimepicker

【解决方案1】：

您必须更改 format 选项的值才能获得 12 小时弹出窗口，只需添加一个 a，正如链接时刻文档所述，它代表 am / pm 字符串。

这是一个工作示例：

$(document).ready(function ($) {
    $('#TheTime').datetimepicker({
        format: 'hh:mm a'
    });                        
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/>

<div class="form-group">
    <div class='input-group date' id='TheTime'>
        <input type='text' class="form-control" />
        <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
        </span>
    </div>
</div>

如果您必须在输入字段中显示 tt 文本，请查看此处：

【讨论】：

太棒了！你！我没有看到记录。