Bootstrap Datepicker不起作用，datetimepicker不是功能
[英]Bootstrap Datepicker not working, datetimepicker is not a function
问题描述
i am new to bootstrap, i am trying to implement bootstrap date picker, but somehow it is not happening. 
我是Bootstrap的新手，我正在尝试实现Bootstrap Date Picker，但是不知何故。 Can you please check which code of mine is going wrong. 能否请您检查我的哪个代码出了问题。 below is my .html file 以下是我的.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<body>
<div class="container">
<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>
</div>
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
</body>
</html>
3 个解决方案
解决方案1
0 2015-11-03 05:27:01
somehow i got the work around.. but still it has some issues with time, if anyone has a better solution please post it 我以某种方式解决了问题..但是仍然有一些时间问题，如果有人有更好的解决方案，请发布它
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet" type="text/css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
</head>
<body>
<div class="container">
<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>
</div>
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
</body>
</html>
解决方案2
0 已采纳 2015-11-03 05:38:03
i think you are missing the DateTimepicker scripts please include this scripts 我认为您缺少DateTimepicker脚本，请包括此脚本
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
and you can just go through the demo http://code.runnable.com/UmOlOZbXvZRqAABU/bootstrap-datepicker-example-text-input-with-specifying-date-format2 您只需浏览演示http://code.runnable.com/UmOlOZbXvZRqAABU/bootstrap-datepicker-example-text-input-with-specifying-date-format2
解决方案3
0 2015-11-03 05:42:22
Change this: 更改此：
$(function () {
$('#datetimepicker1').datetimepicker();
});
to this: 对此：
jQuery(function($) {
$('#datetimepicker1').datetimepicker();
});
Reason: 原因：
Many JavaScript libraries use $ as a function or variable name, just as jQuery does. 就像jQuery一样，许多JavaScript库都将$用作函数或变量名。 In order to avoid conflicts, you need to specify the library alias of $ which in jQuery's case, $ is just an alias for jQuery . 为了避免冲突，您需要指定$的库别名，在jQuery的情况下， $只是jQuery的别名。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.