bootstrap-datepicker错误：datepicker不是函数

Question

有人可以帮助我解决此错误吗？在检查其他解决方案时，他们说他们两次声明了jquery，这就是它显示的原因。但就我而言，我只声明了一次jQuery。请参见下面的代码段：

$(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>

以及下面您可以看到的是我的文件夹目录和声明：

控制台上显示的错误：

Answer 1

尝试遵循此示例here ...

您的代码的区别在于，您在jQuery中使用了id而不是class：

$(document).ready(() => {
  $(".datepicker").datepicker({
    format: "mm-yyyy",
    startView: "months",
    minViewMode: "months"
  });
})

也更改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>

Answer 2

看来bootstrap-datepicker没有正确加载，请确保您的js文件路径正确，我无法真正确定路径是否正确，但是，加载脚本的顺序正确。尝试将CDN用于jquery和bootstrap

<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>

Answer 3

<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>

这对我有用，我在控制台上看不到任何错误。我只是将您的文件路径替换为CDN。我确定您的路径有问题

bootstrap-datepicker错误：datepicker不是函数

问题描述投票：0回答：3

3个回答

最新问题

bootstrap-datepicker错误：datepicker不是函数

问题描述 投票：0回答：3

3个回答

最新问题

问题描述投票：0回答：3