对象不支持属性或方法 datepicker答案

【问题标题】：object doesn't support property or method datepicker对象不支持属性或方法 datepicker
【发布时间】：2015-07-23 08:27:57
【问题描述】：

我试图在我的页面中放置一个日期选择器并收到此错误。我已经搜索并寻找此错误的其他答案，但找不到任何答案。

没有 FOR BOOTSTRAP 部分，它可以工作；但有了它，我收到了这个错误。这背后的原因是什么，我该如何解决？

这是我的index.cshtml：

@{
    Layout = null;
}

<!DOCTYPE html>

<html lang="en">
<head>

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/Chart")
    @Scripts.Render("~/bundles/moment")
    <meta charset="utf-8" />
    <title>ENOCTA DASHBOARD</title>

    <!-- FOR DATEPICKER -->
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">
    <script>
        $(function () {
            $("#datepicker").datepicker();
        });
    </script>

    <!-- FOR BOOTSTRAP -->
    <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">
    <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>

</head>

<body>
    <p>Date: <input type="text" id="datepicker"></p>
</body>

</html>

【问题讨论】：

您的 jquery-ui 是否包含 datepicker 小部件？
我不知道。我该如何检查？
当您下载 jquery-ui (jqueryui.com/download) 时，您可以排除不使用的小部件/组件。也许尝试下载一个完整的 jquery-ui，或者在 jquery-ui.js 中搜索 datepicker 小部件。
我下载了数据包并将.js和.css文件添加到项目中，并据此更改了Bundleconfig.css。没有任何改变。

标签： jquery twitter-bootstrap datepicker

【解决方案1】：

页面上有 2 个版本的 jQuery，jQuery UI 日期选择器将自己挂在第一个版本中，然后第二个覆盖第一个版本，因此当DOMContentReady 事件被触发时，日期选择器不可用。解决方案是将第二个 jquery 包括上移并删除第一个：

<!-- FOR DATEPICKER -->
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
    $(function () {
        $("#datepicker").datepicker();
    });
</script>

<!-- FOR BOOTSTRAP -->
<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">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

【讨论】：