bootstrap-datepicker 错误：datepicker 不是 function
[英]bootstrap-datepicker error: datepicker is not a function
问题描述
Can someone please help me with this error?
有人可以帮我解决这个错误吗？ Upon checking other solutions they say that they declared the jquery twice that's why it shows.在检查其他解决方案后，他们说他们两次声明了 jquery，这就是它显示的原因。 But in my case I only declared the jquery once.但就我而言，我只声明了一次 jquery。 Please see the code snippet below:请看下面的代码片段：
$(document).ready(() => { $("#datepicker").datepicker({ format: "mm-yyyy", startView: "months", minViewMode: "months" }); })
<html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>My Teasting Website</title> <.--Bootstrap css--> <link rel="stylesheet" href="src/bootstrap/css/bootstrap.min.css"> <.--bootstrap-datepicker css--> <link rel="stylesheet" href="src/bootstrap-datePicker/css/bootstrap-datetimepicker.min.css"> </head> <body> <input type="text" readonly="readonly" name="date" id = "datepicker"> <span class="add-on"><i class="icon-th"></i></span> <.--Jquery js--> <script src="src/jquery.js"></script> <.--Bootstrap js--> <script src = "src/bootstrap/js/bootstrap.min.js"></script> <!--bootstrap-datepicker js --> <script src="src/bootstrap-datePicker/js/bootstrap-datetimepicker.min.js"></script> <script src = "js/script.js"></script> </body> </html>
and below as you can see is my folder directories and declaration:如您所见，下面是我的文件夹目录和声明：
The error shown on the console:控制台上显示的错误：
3 个解决方案
解决方案1
0 2020-05-11 07:32:17
Try to follow this example here ...尝试在此处遵循此示例...
The difference in your code is that you used id instead of class in jquery:您的代码的不同之处在于您在 jquery 中使用了id而不是class ：
$(document).ready(() => {
$(".datepicker").datepicker({
format: "mm-yyyy",
startView: "months",
minViewMode: "months"
});
})
Also, change the HTML:此外，更改 HTML：
<div class="input-group date" data-provide="datepicker">
<input type="text" class="form-control">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
解决方案2
0 2020-05-11 07:41:17
it looks like bootstrap-datepicker is not loaded correctly make sure your js files paths are correct, I can't really tell if the paths are correct, however, the order of loading scripts is correct.看起来 bootstrap-datepicker 未正确加载确保您的 js 文件路径正确，我无法确定路径是否正确，但是，加载脚本的顺序是正确的。 try using a CDN for jquery and bootstrap尝试为 jquery 和引导程序使用 CDN
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
解决方案3
0 2020-05-12 22:12:01
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>My Teasting Website</title>
<!--Bootstrap css-->
<link rel="stylesheet" href="src/bootstrap/css/bootstrap.min.css">
<!--bootstrap-datepicker css-->
<link rel="stylesheet" href="src/bootstrap-datePicker/css/bootstrap-datetimepicker.min.css">
</head>
<body>
<input type="text" readonly="readonly" name="date" id = "datepicker">
<span class="add-on"><i class="icon-th"></i></span>
<!--Jquery js-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<script>
$(document).ready(() => {
$("#datepicker").datepicker({
format: "mm-yyyy",
startView: "months",
minViewMode: "months"
});
})
</script>
</body>
</html>
this is working for me, I do not see any error on my console.这对我有用，我在控制台上看不到任何错误。 I just replaced your file paths with CDN.我刚刚用 CDN 替换了您的文件路径。 I am sure there is something wrong with your paths我确定你的路径有问题
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.