18

我刚刚创建了一个 ASP .NET MVC 4 WebAPI 项目。

在查看默认的 _Layout.cshtml 时，我看到 jquery 脚本是在渲染主体之后插入的（而不是在头部）。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/themes/base/css", "~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @RenderBody()

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>
</html>

这会导致错误

$ is not defined

当然，试着写

$(document).ready(function() {...}).

移动

@Scripts.Render("~/bundles/jquery")

进入 _Layout.cshtml 的 head 部分可以纠正问题，并且 jquery 可以按预期工作。

这是怎么回事？我是不是做错了什么，Script.Render 在 _Layout.cshtml 中的默认位置是有原因的？

4

3 回答 3

12

脚本加载和执行会阻止页面的呈现。

您可以通过在页面的多个部分添加警报来查看这一点。这就是为什么建议将js文件放在页面后面的原因。

您还可以通过在页面末尾添加 jquery 的页面脚本部分来解决您的问题。

编辑：这是 Scott Guthrie 关于剃须刀部分的文章：http ://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor .aspx

于 2012-08-12T22:45:42.657 回答
3

@Scripts.Render("~/bundles/jquery")导致 MVC 4 和 VS 2010 出现问题。当您尝试创建 jQuery 对话框时，此问题变得更加明显。

正如 JeffN825 所说，唯一的出路是注释掉@Scripts.Render("~/bundles/jquery").

现在未知的是：注释掉的后果是什么@Scripts.Render("~/bundles/jquery")？

我正在使用以下 jquery 库：

<script src="../../Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.23.min.js" type="text/javascript"></script>

注意：jquery-1.7.2.min.js 不起作用。

于 2012-09-23T16:26:01.593 回答
0

尽管接受的答案链接到有关如何做到这一点的详细信息，但更直接的答案如下：

_Layout.cshtml 包含该行...

@RenderSection("scripts", required: false)

...这将在视图中插入一个名为“脚本”的部分 - 例如 Index.cshtml：

<p>This is Index.cshtml</p>
@section scripts {
   <script>
      $(document).ready(function() {
         alert("This script is inserted by RenderSection after jQuery script is inserted.")
      })
   </script>
}
于 2016-01-12T02:32:40.667 回答