Glyphicon日历未打开

时间:2015-03-11 10:55:41

标签: javascript css twitter-bootstrap jquery-ui bootstrap-datetimepicker

我尝试使用bootstrap datetimepicker和glyphicon日历。但如果我点击选择器,没有任何反应。

即使是日历也不会打开。我在 .jsp 页面中添加了以下 .js .css 文件:



<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/bootstrap.min.css" media="screen">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/bootstrap-datetimepicker.min.css" media="screen">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/jquery-ui.css"  />
&#13;
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/1.9.2.jquery-ui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/moment-with-locales.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/bootstrap-datetimepicker.min.js"></script>
&#13;
&#13;
&#13;

请帮我弄清楚如何使用bootstrap datetimepicker v4版本。是否需要任何其他 .js .css 文件? datetimepicker显示在图像中:

enter image description here

如果点击选择器,那么日历就不会打开。

1 个答案:

答案 0 :(得分:0)

之后

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/bootstrap-datetimepicker.min.js"></script>

<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
HTML中的

使用以下代码

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