我的错误:
Uncaught TypeError: $(...).datepicker is not a function
我在布局的head部分放置了jquery bundle引用,以确保在javascript函数之前加载它。我做了一个视图源,并没有看到超过1个jquery的引用。 jquery版本是2.1.4。有什么想法吗?
我的观点:
<script type="text/javascript">
$(function() {
$('.date-picker').datepicker({
changeMonth: true,
changeYear: true,
showButtonPanel: true,
dateFormat: 'MM yy',
onClose: function(dateText, inst) {
var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$(this).datepicker('setDate', new Date(year, month, 1));
}
});
});
</script>
<div class="form-group">
@Html.LabelFor(model => model.CCExpiration, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.CCExpiration, new { htmlAttributes = new { @class = "form-control date-picker" } })
@Html.ValidationMessageFor(model => model.CCExpiration, "", new { @class = "text-danger" })
</div>
</div>
_layout
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - Vibe Productions Corporation</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
</head>
Bundles.cs
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js",
"~/Scripts/jquery-ui-1.11.4/jquery-{version}.js"));
答案 0 :(得分:2)
目前,您只是在jQuery UI包中引用jQuery库
crypto.pbkdf2
这应该是:
"~/Scripts/jquery-ui-1.11.4/jquery-{version}.js"));
答案 1 :(得分:1)
我在IE,FireFox和Edge中运行它没有任何问题。我找到了你的例子的来源,我认为不同的唯一想法是隐藏了几个月的日子,所以我把它添加到我的代码中。
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<link href="Scripts/jquery-ui.css" type="text/css" rel="stylesheet" />
<link href="Scripts/jquery-ui.theme.css" type="text/css" rel="stylesheet" />
<script src="Scripts/jquery-2.1.4.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('.date-picker').datepicker({
changeMonth: true,
changeYear: true,
showButtonPanel: true,
dateFormat: 'MM yy',
onClose: function (dateText, inst) {
var p = currentDate = $(".date-picker").datepicker("getDate");
var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$(this).datepicker('setDate', new Date(year, month, 1));
}
});
});
</script>
<style type="text/css">
.ui-datepicker-calendar {
display: none;
}
</style>
</head>
<body>
<div id="info">
<input class="date-picker" />
</div>
</body>
</html>