对象不支持属性或方法datepicker [英] object doesn't support property or method datepicker
问题描述
我试图在我的页面放置一个日期戳，并得到这个错误。我已经搜索并寻找其他答案，但是找不到任何的。
I am trying to put a datepicker in my page and getting this error. I already searched and looked for other answers to this error, but couldn't find any.
没有 FOR BOOTSTRAP 部分，它可以工作;但是，我收到这个错误。这是什么原因，我该如何解决这个问题？
Without the FOR BOOTSTRAP part, it works; but with it, I am getting this error. What is the reason behind this and how can I fix this?
这是我的 index.cshtml p>
Here is my 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>
推荐答案
页面上有2个版本的jQuery， jQuery UI datepicker将其自身挂载到第一个版本，然后第二个覆盖第一个版本，因此当$ code> DOMContentReady 事件被触发时，datepicker不可用。解决方案是移动第二个jquery包括上面的和删除第一个：
You have 2 versions of jQuery on the page, the jQuery UI datepicker hangs itself into the first version, then the second one overwrites the first one and thus the datepicker is not available when the DOMContentReady event is fired. The solution is to move the second jquery include up and remove the first one:
<!-- 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>
这篇关于对象不支持属性或方法datepicker的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
