Eonasdan Bootstrap日期时间选择器格式化

Question

Eonasdan Bootstrap日期时间选择器格式化

htmlcsstwitter-bootstrapjquery-uibootstrap-datetimepicker

5

如何在Bootstrap 3 DateTimePicker中设置格式。我想要的格式是“dd/MM/yyyy hh:mm”，我不想要“AM”和“PM”。我可以使用哪种语言来实现这个功能？以下是示例代码，您可以参考它进行操作： http://jsfiddle.net/Eonasdan/0Ltv25o8/

$('#datetimepicker1').datetimepicker({
 
    format : "dd/MM/yyyy hh:mm",
    
});

<!-- padding for jsfiddle -->
<div class="row">
    <div class="col-md-12">
        

        <div class="form-group">
            <div class="input-group date" id="datetimepicker1">
                <input type="text" class="form-control" /> <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
            </div>
        </div>        
    </div>
</div>

- sathish kumar

2个回答

6

在输入标签中添加 data-date-format="YYYY-MM-DD HH:mm" 也可以起到作用。

<input type="text" class="form-control" data-date-format="YYYY-MM-DD HH:mm"/>

- SuperNova

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- br3w5 · Accepted Answer

$('#datetimepicker1').datetimepicker({format : "DD/MM/YYYY hh:mm"});
$('#datetimepicker2').datetimepicker({format : "DD/MM/YYYY hh:mm"});

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/js/bootstrap-datetimepicker.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.7.14/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/>
</head>
<br/>
<!-- padding for jsfiddle -->
<div class="row">
    <div class="col-md-12">
         <h6>datetimepicker1</h6>

        <div class="form-group">
            <div class="input-group date" id="datetimepicker1">
                <input type="text" class="form-control" /> <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
            </div>
        </div>
         <h6>datetimepicker2</h6>

        <input type="text" class="form-control" id="datetimepicker2" />
    </div>
</div>

我不确定为什么你的代码无法正常工作，使用 dd/MM/yyyy hh:mm 会输出 We/04/yyyy 08:43。如果你想要输出例如 01/03/2015 12:01，你需要设置 format : "DD/MM/YYYY hh:mm"。如需了解更多格式选项，请查看 momentjs 文档。

请查看更新后的 jsfiddle。

你需要确保包含 datetimepicker 所需的所有必要 css 和 js 文件。你还需要先加载 momentjs 和 jquery。请参见代码片段。