未定义MVC-jQuery
我试图调用bootstrap datepicker，从这里看到的类似问题，我认为我引用的是正确的，但当我打开chrome developer时，jQuery没有定义，下面图片链接中的开发者截图 捆绑配置未定义MVC-jQuery,jquery,asp.net-mvc,model-view-controller,bootstrap-datetimepicker,Jquery,Asp.net Mvc,Model View Controller,Bootstrap Datetimepicker,我试图调用bootstrap datepicker，从这里看到的类似问题，我认为我引用的是正确的，但当我打开chrome developer时，jQuery没有定义，下面图片链接中的开发者截图 捆绑配置 public static void RegisterBundles(BundleCollection bundles) { bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate*"));
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/respond.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"));
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery.unobtrusive-ajax.min.js"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap-datetimepicker").Include(
"~/Scripts/moment.js",
"~/Scripts/bootstrap-datetimepicker.js"));
bundles.Add(new StyleBundle("~/Content/bootstrap-datetimeicker").Include(
"~/Content/bootstrap-datetimepicker.min.css"));
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - Public Events</title>
@Styles.Render("~/Content/css")
@RenderSection("styles", required: false)
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Events", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
@if (Request.IsAuthenticated)
{
<li>@Html.ActionLink("My Events", "My", "Events")</li>
<li>@Html.ActionLink("Create Event", "Create", "Events")</li>
}
</ul>
@Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
@Html.Partial("_Notifications")
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - Events Application</p>
</footer>
</div>
@ViewBag.Title-公共事件
@style.Render（“~/Content/css”）
@RenderSection（“样式”，必填项：false）
@Scripts.Render（“~/bundles/modernizer”）
@Scripts.Render（“~/bundles/jquery”）
@Scripts.Render（“~/bundles/bootstrap”）
@RenderSection（“脚本”，必需：false）
@ActionLink（“事件”、“索引”、“主页”、新的{area=”“}、新的{@class=“navbar品牌”}）
@如果（请求已验证）
{
- @ActionLink（“我的事件”、“我的”、“事件”）
- @ActionLink（“创建事件”、“创建”、“事件”）
}
@Html.Partial（“_LoginPartial”）
@Html.Partial（“\u通知”）
@RenderBody（）
&抄袭@DateTime.Now.Year-事件应用程序
@model Events.Web.Models.EventInputModel
@{
ViewBag.Title = "Create New Event";
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Create</title>
</head>
<body>
<h2>Create</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>EventInputModel</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.StartDateTime, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.StartDateTime, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.StartDateTime, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Duration, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Duration, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Duration, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Location, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Location, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Location, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.IsPublic, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.CheckBoxFor(model => model.IsPublic, htmlAttributes: new { @checked = "true" })
@Html.ValidationMessageFor(model => model.IsPublic, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
@Html.ActionLink("Cancel", "My", null, htmlAttributes: new { @class = "btn" });
</div>
</div>
</div>
}
@section scripts{
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap-datetimepicker")
<script>
$(function () {
$('#StartDateTime').datetimepicker(
{
format: 'DD-MMM-YYYY HH:mm',
sideBySide: true,
showTodayButton: true
});
});
</script>
}
@section styles{
@Styles.Render("~/Content/bootstrap-datetimepicker")
}
@model Events.Web.Models.EventInputModel
@{
ViewBag.Title=“创建新事件”；
}
创造
创造
@使用（Html.BeginForm（））
{
@Html.AntiForgeryToken（）
事件输入模型
@Html.ValidationSummary（true，“，new{@class=“text danger”}）
@LabelFor（model=>model.Title，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.Title，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.Title，“，new{@class=“text danger”}）
@LabelFor（model=>model.StartDateTime，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.StartDateTime，new{htmlAttributes=new{@class=“form control”}}）
@Html.ValidationMessageFor（model=>model.StartDateTime，“，new{@class=“text danger”}）
@LabelFor（model=>model.Duration，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.Duration，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.Duration，“，new{@class=“text danger”}）
@LabelFor（model=>model.Description，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.Description，new{htmlAttributes=new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.Description，“，new{@class=“text danger”}）
@LabelFor（model=>model.Location，htmlAttributes:new{@class=“controllabel col-md-2”}）
@EditorFor（model=>model.Location，new{htmlAttributes=new{@class=“form control”}}）
@Html.ValidationMessageFor（model=>model.Location，“，new{@class=“text danger”}）
@LabelFor（model=>model.IsPublic，htmlAttributes:new{@class=“controllabel col-md-2”}）
@CheckBoxFor（model=>model.IsPublic，htmlAttributes:new{@checked=“true”}）
@Html.ValidationMessageFor（model=>model.IsPublic，“，new{@class=“text danger”}）
@ActionLink（“取消”，“我的”，空，htmlAttributes:new{@class=“btn”}）；
}
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
@Scripts.Render（“~/bundles/bootstrap datetimepicker”）
$（函数（）{
$（“#StartDateTime”）.datetimepicker(
{
格式：“DD-MMM-YYYY HH:mm”，
是的，
ShowToday按钮：true
});
});
}
@剖面样式{
@style.Render（“~/Content/bootstrap datetimepicker”）
}
您将从屏幕截图中看到jquery没有作为脚本之一加载，这总是意味着您忘记在该页面上包含jquery包
@section scripts{
@Scripts.Render("~/bundles/jquery") // <-- this'll probably fix it
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap-datetimepicker")
@节脚本{
@Scripts.Render（“~/bundles/jquery”）//此行：@RenderSection（“styles”，必填项：false）
应位于此行下方：1@Scripts.Render（“~/bundles/jquery”）1.如下所示：@Scripts.Render（“~/bundles/jquery”）
@RenderSection（“样式”，必填项：false）
@Marcin-为什么jquery在样式之前加载会很重要？@Jamiec shi..我看到了RenderSection（“脚本”…
my foult sry:/你在使用\u布局
页面吗？你没有@RenderSection（“脚本”，必需：false）
在您列出的布局中。那么要么您的服务器上没有jQuery文件（我认为在创建捆绑包时会引发异常），或者创建页面正在使用不同的布局页面。这将是我要检查的前两个位置。它是否应该由_布局页面上的脚本部分加载？——也是为了避免两次引用jQuery（如您的情况）仔细检查您是否尚未将其作为捆绑包包含在您的_布局中。@MichaelO'R-嗯，这是令人困惑的一点。您的布局页面似乎包含“样式”部分，但您的创建页面定义了一个名为“脚本”的部分。您可能缺少部分定义
@Styles.Render("~/Content/css")
@RenderSection("styles", required: false)
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/modernizr")
@RenderSection("scripts", required: false) // <-- placed *after* the jquery bundle