Bootstrap datetimepicker v4.x 12小时不工作

时间:2017-08-01 21:12:15

标签: bootstrap-datetimepicker eonasdan-datetimepicker

我一直试图让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。< / p>

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

1 个答案:

答案 0 :(得分:0)

您必须更改format选项的值才能获得12小时的弹出窗口,只需添加a即可,因为链接时刻文档状态代表am / {{ 1}}字符串。

这是一个工作示例:

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>文字,请查看此处: