我正在尝试从这里使用引导日期时间选择器:http: //eonasdan.github.io/bootstrap-datetimepicker/
但我似乎无法让这个简单的例子运行起来。当我单击日历字形时,什么也没有发生,我希望日期时间选择器会出现!这是源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Template for bootstrap</title>
<link href="dependencies/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="dependencies/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="dependencies/jquery/jquery-2.0.3.js"></script>
</head>
<body>
<div class="container">
<div class="col-md-10">
<div class="well">
<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>
<script type="text/javascript">
$(function() {
$('#datetimepicker1').datetimepicker();
});
</script>
</div>
</div>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="dependencies/bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="dependencies/bootstrap-datetimepicker.min.js"></script>
</body>
</html>
编辑 1:我也尝试在包含 js 库之后和正文结束标记之前调用 timepicker 函数,但没有成功。
<body>
<div class="container">
<div class="col-md-10">
<div class="well">
<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>
</div>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="dependencies/bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="dependencies/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript">
$(function() {
$('#datetimepicker1').datetimepicker();
});
</script>
</body>