jQuery Bootstrap 3 DatePicker 不工作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20983727/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap 3 DatePicker not working
提问by watyeag
Trying to use the datepicker here: http://bootstrap-datepicker.readthedocs.org/en/latest/
尝试在此处使用日期选择器:http: //bootstrap-datepicker.readthedocs.org/en/latest/
I'm not that experienced with jquery yet, but I must be missing something because it never works. Here is my HTML, all of the CSS and JS files are in the respective locations, no issues with being unable to find the files. I'm sure I'm missing something easy, but I don't see it, copying and pasting straight from the examples provided. Let me know what you think.
我还没有使用 jquery 的经验,但我一定遗漏了一些东西,因为它永远无法工作。这是我的 HTML,所有 CSS 和 JS 文件都在各自的位置,找不到文件没有问题。我确定我错过了一些简单的东西,但我没有看到它,直接从提供的示例中复制和粘贴。让我知道你的想法。
<!DOCTYPE html>
<html>
<head>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/datepicker.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-8">
<form id="main">
<input type="text">
</form>
<script>
$('#main input').datepicker({
});
</script>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
</body>
</html>
回答by Jasen
You have a few issues with your code
您的代码有一些问题
- You need a document ready handler
- You need to place your script last after including the libraries
- You have duplicate script tags
- 您需要一个文档就绪处理程序
- 在包含库之后,您需要将脚本放在最后
- 您有重复的脚本标签
Here's what you need to make it work
这是让它发挥作用的必要条件
<!DOCTYPE html>
<html>
<head>
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/datepicker.css" rel="stylesheet" />
</head>
<body>
<form id="main">
<input type="text" />
</form>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script>
$(document).ready(function() {
$("#main input").datepicker();
});
</script>
</body>
</html>