如何在MVC4的局部视图中添加脚本?

Dar*_*Zon 38 asp.net asp.net-mvc razor asp.net-mvc-4 razor-2

这是我在局部视图中的代码

@model Contoso.MvcApplication.Models.Exercises.AbsoluteArithmetic

@using(Html.BeginForm())
{
<div>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number1</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">+</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number2</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">=</span>
    <span>
            @Html.EditorFor(model => model.Result)
            @Html.ValidationMessageFor(model => model.Result)
    </span>
</div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}
Run Code Online (Sandbox Code Playgroud)

请注意我的代码底部,我有一个@section,我意识到如果我在那里设置一个断点,它就不会运行.如果我在_Layout.cshtml中移动该行,则效果很好,但这不是主意.

如何在部分剃刀视图中告诉MVC4我想添加该库?

Nis*_*aan 15

您可以使用 @Scripts.Render("~/Scripts/my-script.js").js文件和@Styles.Render("~/Content/my-Stylesheet.css")css文件.

Nb:它适用于特定的捆绑包更多细节 - ' http://www.asp.net/mvc/overview/performance/bundling-and-minification '

它适用于剃刀中的任何子页面,包括部分视图.有关这些帮助程序的使用的更多信息谷歌

  • 这是可行的,但是如果您以这种方式包含的脚本依赖于包含在父页面的“@section”中的其他脚本(例如 jQuery、Bootstrap),如果它们在依赖项之前呈现,则它们可能无法工作。 (2认同)

vip*_*naz 8

您无法从局部渲染布局部分.将节定义移动到父页面或布局.

  • 但是当通过ajax调用调用部分视图并且它必须包含一些特定的js库和样式时的情况是什么? (9认同)

Eri*_*ips 5

查看我的答案如何在局部视图中渲染一个截面,它允许您在任何视图/局部视图中定义脚本和样式.它还负责重复包含.

我个人认为部分不是一个很好的解决方案的样式和JavaScript 包括.


Var*_*yee 5

此问题没有通用的解决方案,但您可以执行以下最简单的方法:

1)您可以创建一组扩展方法,如下所示:

/sf/answers/467023651/

2) 只需将您的 javascript 代码移动到一个单独的部分视图中,然后在您的主视图上呈现 2 个部分视图。一个用于主局部视图,另一个用于您的脚本,如下所示:

{
    // markup and razor code for Main View here

    @Html.Partial("Main_PartialView")
}

@section Scripts
{
    @Html.Partial("JavaScript_PartialView")
}
Run Code Online (Sandbox Code Playgroud)

希望能帮助到你。


Pil*_* 77 5

您可以直接在部分视图html的末尾添加脚本,而无需添加脚本部分(因为脚本部分未在部分视图中呈现)

<script language="javascript">
   // Your scripts here
   // ....
</script>
Run Code Online (Sandbox Code Playgroud)