MVC视图文件_Layout.cshtml中头部和主体的Render Bundles之间的差异

The difference between the Render Bundles at head and body in MVC View file, _Layout.cshtml

本文关键字:Render 主体 Bundles 之间 头部 文件 视图 Layout cshtml MVC      更新时间:2024-02-08

我想在ASP.NET MVC中使用jQuery UI DatePicker。

这是由一个网站教程完成的:如何在ASP.NET MVC 4中使用jQuery UI DatePicker。

步骤如下:

步骤1:在_Layout.cshtml文件中将bundle从body修改为head。

    <head>
       ...
       @Scripts.Render("~/bundles/jquery")
    </head>

第2步:要为日期时间选取器函数创建文本框,请选择日期时间。

步骤3:包含jQuery UI快速访问中的jQuery"链接"answers"脚本"。

第4步:设置当用户选择日期时间时显示日期时间的函数。

附言:以上超链接中从第2步到第4步的详细信息。并且都在Index.chtml文件中。

问题是,为什么我必须修改bundles脚本部分以引导?(步骤1)

为什么当我在正文部分设置bundle脚本时它不起作用?

捆绑脚本在主体和头部之间有什么区别?

您可以将脚本链接放置在文档中的任何位置。你应该放在哪里是有争议的。

唯一的想法是你应该确保你是否把脚本放在正确的顺序。例如,JqueryUI插件依赖于Jquery插件。因此,您应该始终先包含Jquery,然后再包含Jquery UI。

在视频中,Visual Studio将渲染模块放置在页面末尾,作者只是决定将其放置在页面的开头,然后当他添加Jquery UI时,他将其添加到index.cshtml上,以在Jquery 之后渲染Jquery UI

如果要将渲染保持在_Layout页面的底部,则应在"渲染部分"模块之后的_Layout页中添加jquery UI链接。

示例

<!DOCTYPE html>
<html>
<head>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
</head>
<body>
    <div class="container-fluid">
        @RenderBody()
    </div>
    @Scripts.Render("~/bundles/jquery")
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
    @RenderSection("Scripts", required: false)
    </body>
</html>

希望这能有所帮助!!