我尝试这样做的主要动机是获取Javascript,只需要页面底部的部分Javascript和其他Javascript,而不是在部分呈现的页面中间.
这是我正在尝试做的简化示例:
这是在正文之前的Scripts部分的布局.
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
</head>
<body>
@RenderBody()
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
@RenderSection("Scripts", false)
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这是使用此布局的示例视图.
<h2>This is the view</h2>
@{Html.RenderPartial("_Partial");}
@section Scripts {
<script type="text/javascript">
alert("I'm a view.");
</script>
}
Run Code Online (Sandbox Code Playgroud)
这是从视图中呈现的部分内容.
<p>This is the partial.</p>
@* this never makes it into the rendered page *@
@section Scripts {
<script type="text/javascript">
alert("I'm a partial.");
</script>
}
Run Code Online (Sandbox Code Playgroud)
在此示例中,视图中指定的标记放在节中,但不包含部分标记.是否可以使用Razor从局部视图填充部分?如果没有,还有哪些其他方法可以获取Javascript,只需要页面底部的部分内容,而不是全局包含它?
我有一个使用MVC4和Razor视图的Web应用程序,它们使用了大量的JQuery和其他插件脚本.
为了加快视图的渲染速度,我相信一般来说,最好将脚本渲染到正文的底部,因此布局(大大合并)如下所示:
<body>
@RenderBody()
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/other")
@RenderSection( "Scripts", false )
</body>
Run Code Online (Sandbox Code Playgroud)
该Scripts
部分允许特定视图添加其他JQuery函数,并保证它们在JQuery库之后呈现.到现在为止还挺好.
现在考虑视图中的以下片段,该片段为集合中的每个项目呈现部分:
@foreach (var item in Model.Items)
{
Html.RenderPartial("_MyPartial", item);
}
Run Code Online (Sandbox Code Playgroud)
这个部分(_MyPartial)需要根据集合项详细信息(如下面的代码段)为控件呈现JQuery:
$(function () {
$("#@(Model.Id)").click(function () {
// do something when control on partial with id Model.Id is clicked
alert("I've been clicked!");
});
});
Run Code Online (Sandbox Code Playgroud)
部分视图JQuery函数不会被执行,因为在每个集合项的_MyPartial脚本之前没有加载JQuery库.在chrome调试器中运行显示$ not defined
,这证实了这一点.
我可以做一些非常丑陋的事情,例如在脚本部分复制每个foreach语句,用于调用partial的所有视图,然后让父视图生成脚本.但是,这实际上会破坏局部视图的可重用性.
有没有办法让Razor部分视图脚本延迟渲染(例如在父脚本部分中),或者是针对此问题的不同方法?