我正在尝试使用 BootStrap DateTimePicker,但它没有在屏幕上正确显示。我的 HTML 如下所示。
<div class='input-group date' id='startDate'>
<input type='text' class="form-control" name="startDate" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</div>
Javascript 如下所示。
$(document).ready(function () {
// DateTime picker for Dates
$("#startDate").datetimepicker();
});
我加载 javascript 和 css 文件的顺序如下。
<link href="/Content/css/datepicker.css" rel="stylesheet"/>
<link href="/Content/css/bootstrap-datetimepicker.css" rel="stylesheet"/>
<link href="/Content/css/bootstrap.css" rel="stylesheet"/>
<script src="/Scripts/jquery-2.1.0.js"></script>
<script src="/Scripts/jquery-ui-1.10.0.custom.js"></script>
<script src="/Scripts/bootstrap-datepicker.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/moment.js"></script>
<script src="/Scripts/bootstrap-datetimepicker.js"></script>
通过以上设置,日期时间选择器在没有任何适当的 CSS 的情况下显示如下。更改月份的箭头按钮显示不正确。
我尝试更改顺序,但仍然显示相同。有人可以帮我解决我所缺少的吗?
最佳答案
好的,检查这个 fiddle :
http://jsfiddle.net/8hmcfmLh/1/
你不需要 jquery-ui 或 bootstrap-datepicker,只需要 bootstrap-datetimepicker 和 moment.js
<div class="input-group date" id="startDate">
<input type="text" class="form-control" name="startDate" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
$(document).ready(function () {
// DateTime picker for Dates
$("#startDate").datetimepicker();
});
关于javascript - 无法让 Bootstrap 日期时间选择器正确显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27108397/