Javascript 未捕获的TypeError:$（…）。datepicker不是函数（匿名函数）

我发现关于堆栈溢出的答案很少，但仍然无法解决我的问题。 我正在Django上运行，但我认为这与此错误无关

我试着让work成为我的日期选择器java脚本，但我得到了错误

1:27未捕获的TypeError:$（…）。datepicker不是函数（匿名函数）@1:27fire@jquery-1.9.1.js:1037self.fireWith@jquery-1.9.1.js:1148jQuery.extend.ready@jquery-1.9.1.js:433completed@jquery-1.9.1.js:103 jquery-2.1.0.min.js:4 XHR已完成加载：POST'.l.cors.a.crossDomain.send@jquery-2.1.0.min.js:4o.extend.ajax@jquery-2.1.0.min.js:4PNR.findNumbers@pnr.js:43parseContent@contentscript.js:385processMutatedElements@contentscript.js:322

这是我所有的脚本：

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />


<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('.dateinput').datepicker({ format: "yyyy/mm/dd" });
}); 
</script>

      <!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<!-- Just to make our placeholder images work. Don't actually copy the next line! -->
<script src="http://getbootstrap.com/assets/js/vendor/holder.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="http://getbootstrap.com/assets/js/ie10-viewport-bug-workaround.js"></script>
 <script type="text/javascript">
              $(document).ready(function() {
                  $("#extra-content").hide();
                  $("#toggle-content").click(function(){
                      $("#extra-content").toggle();
                  });
              });
 </script>            

$（文档）.ready（函数（）{
$（'.dateinput'）.datepicker（{格式：“yyyy/mm/dd”}）；
}); 
window.jQuery | | document.write（“”）
$（文档）.ready（函数（）{
$（“#额外内容”）.hide（）；
$（“#切换内容”）。单击（函数（）{
$（“#额外内容”）.toggle（）；
});
});

任何反馈都将非常感谢

哪里出了问题？ 第一次包含jQuery时：

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>

它将撤消插入，因此，

$（…）。日期选择器

将变得未定义

尽管第一个

$（document）.ready

块在此之前出现，但匿名回调函数体在加载所有脚本之前不会执行，并且此时

$（…）

（

窗口。$

准确地说）引用的是最近加载的jQuery

如果您立即调用

$（'.dateinput'）.datepicker

，而不是在

$（document.ready

回调中调用，则不会遇到此问题，但是您需要确保目标元素（带有类

dateinput

）在脚本之前已经在文档中，通常建议使用

ready

回调

解决方案 如果您想从jQueryUI使用

datepicker

，那么在引导之后包含jQueryUI脚本可能最有意义。jQueryUI1.11.4与jQuery1.6+兼容，因此可以正常工作

---

或者（特别是如果您没有使用jquery ui进行任何其他操作），您可以尝试。

由于未定义函数，因此会出现此错误。

---

在我的例子中，我调用了datepicker函数，但没有包含发生此错误时的datepicker js文件

您只需要添加三个文件和两个css链接。您也可以选择cdn。 js文件和css文件的链接如下：-

jQuery.dataTables.min.js

dataTables.bootstrap.min.js

dataTables.bootstrap.min.css

bootstrap-datepicker.css

bootstrap-datepicker.js

如果在项目中使用引导，则它们是有效的

我希望这对你有帮助。 当做

---

Vivek Singla

错误是因为您在两个位置包含脚本链接，这两个位置将覆盖和重新初始化日期选择器

$（文档）.ready（函数（）{
$（'.dateinput'）.datepicker（{格式：“yyyy/mm/dd”}）；
}); 

包含对Jquery库的多个引用是错误的原因仅包含对Jquery库的一个引用，这将解决问题如果您使用ASP.NET MVC

打开布局文件“\u layout.cshtml”或自定义布局文件

在您看到的代码部分，如下所示：

@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
@Scripts.Render("~/bundles/jquery")

删除行“@Scripts.Render（~/bundles/jquery”）”

（在您看到的代码部分）过去为最新的行，如下所示：

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")

---

这对我有帮助，希望对你也有帮助。

你应该只为startWell调用jQuery一次，因为你已经包含了正确的jQuery-ui.js，而且它仍然说datepicker（）不是一个函数，你的选择器可能不正确吗？$（'.dateinput'）是否在页面加载后存在，或者是动态添加的，并在我删除jquery的包含时仔细检查它是否是类名而不是id（$（'.dateinput'）），您的html是什么样子的？您是否为输入字段分配了“dateinput”类？因为我使用的是Webpack，所以需要使用jquery ui捆绑包。这是一个很好的提醒。在我的例子中，我已经从另一个php包含文件调用了jQueryUI。所以这和你正确陈述的效果是一样的。谢谢我也有同样的错误我有bootstrap.min.css，jquery-1.9.1.js，jquery ui.js，jquery.min.js我应该给出什么顺序谢谢，这很有帮助。

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")