logo标签列表

对象不支持属性或方法 "datepicker"。

jquerytwitter-bootstrapdatepicker
4
我正在尝试将一个日期选择器放在我的页面上，但出现了这个错误。我已经搜索并查找其他关于这个错误的答案，但没有找到任何解决方法。
如果没有适用于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包含日期选择器小部件吗？ - M4N
我不知道。我该如何检查？ - kalahari
当你下载jquery-ui（http://jqueryui.com/download/）时，你可以选择排除你不使用的小部件/组件。也许尝试下载完整的jquery-ui，或者在jquery-ui.js中搜索datepicker小部件。 - M4N
我下载了这个包并将.js和.css文件添加到项目中，还根据此更改了Bundleconfig.css。但是什么也没有改变。 - kalahari
1个回答
4
页面上有两个版本的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>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接