43

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

@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")
}

请注意，在我的代码底部，我有一个@section，并且我意识到如果我在那里设置断点，它就不会运行。如果我在 _Layout.cshtml 中移动那条线，效果会很好，但这不是想法。

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

4

9 回答 9

18

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

注意：它也适用于特定捆绑包更多详细信息 - ' http://www.asp.net/mvc/overview/performance/bundling-and-minification '

它适用于 razor 中的任何子页面，包括部分视图。欲了解更多信息谷歌这些助手的使用

于 2016-03-22T15:02:36.640 回答
13

可以直接在局部视图 html 的末尾添加脚本，不需要脚本部分（因为脚本部分不会在局部视图中呈现）

<script language="javascript">
   // Your scripts here
   // ....
</script>
于 2017-12-06T13:08:40.967 回答
8

您不能从部分渲染布局部分。将部分定义移动到父页面或布局。

于 2013-01-01T21:49:54.393 回答
5

查看我的答案How to render a Section in a Partial View，它允许您在任何视图/部分视图中定义脚本和样式。它还负责处理重复的包含。

我个人的看法是，部分不是样式的好解决方案，并且 javascript包含.

于 2013-01-01T22:05:52.943 回答
5

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

1）您可以创建一组扩展方法，如下所示：

https://stackoverflow.com/a/6671766/5208058

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

{
    // markup and razor code for Main View here

    @Html.Partial("Main_PartialView")
}

@section Scripts
{
    @Html.Partial("JavaScript_PartialView")
}

希望能帮助到你。

于 2016-04-20T17:35:45.240 回答
3

这对我有用，允许我将 JavaScript 和 HTML 用于同一文件中的部分视图，以便于阅读

在使用名为“ _MyPartialView.cshtml ”的局部视图的视图中

<div>
    @Html.Partial("_MyPartialView",< model for partial view>,
            new ViewDataDictionary { { "Region", "HTMLSection" } } })
</div>

@section scripts{

    @Html.Partial("_MyPartialView",<model for partial view>, 
                  new ViewDataDictionary { { "Region", "ScriptSection" } })

 }

在部分视图文件中

@model SomeType

@{
    var region = ViewData["Region"] as string;
}

@if (region == "HTMLSection")
{


}

@if (region == "ScriptSection")
{
        <script type="text/javascript">
    </script">
}
于 2017-01-12T13:03:50.523 回答
0

这个 Stackoverflow 页面为这个问题提供了完整的解决方案： Using section in Editor/Display templates

TL;DR：只需将 Forloop.HtmlHelpers nuget 包https://www.nuget.org/packages/Forloop.HtmlHelpers/添加到您的项目中，即可在 ASP.NET MVC 中从 Razor 部分视图和模板运行 Javascript。我个人在我的 MVC 5 项目中使用了它。

于 2017-02-14T16:32:33.950 回答
0

如果您只想在某些部分视图中包含特定脚本并避免在整个应用程序中不必要地传播它们，您可以执行以下操作：

定义一个指向您的空 javascript 文件的包BundleConfig.cs：

 bundles.Add(new ScriptBundle("~/bundles/empty").Include(
                    "~/Scripts/empty.js"
            ));

在你的 head 部分_Layout.cshtml，添加这个变量：

@{
        ViewBag.AdditionalBundle = String.IsNullOrEmpty(ViewBag.AdditionalBundle) ? "~/bundles/empty" : ViewBag.AdditionalBundle;
    }

在你的底部_Layout.cshtml，渲染你想要的任何额外的包：

@Scripts.Render("~/bundles/lib")
    @Scripts.Render(@ViewBag.AdditionalBundle);
    @RenderSection("scripts", required: false)

最后，在需要任何特定脚本的局部视图中，只需将相应的包添加到变量中：

ViewBag.AdditionalBundle = "~/bundles/mySpecificBundle";

部分视图在 之前呈现_Layout.cshtml，因此您需要在文件顶部进行验证。它是这样的：如果任何部分视图为 分配了值ViewBag.AdditionalBundle，则使用它。否则，渲染一个空脚本。

于 2019-02-25T20:22:20.720 回答
0

新手技巧：在已加载的文件中定义一个函数，并在部分视图加载时调用该函数。

1.有一个单独的 js 文件，你可以用你通常的包加载：

BundleConfig.cs

bundles.Add(new ScriptBundle("~/bundles/CustomScripts").Include(
    "~/Scripts/Custom/partial-view.js"
));
  1. 像布局中的任何其他包一样加载自定义脚本包

_Layout.cshtml

@Scripts.Render("~/bundles/CustomScripts");
  1. 在自定义 js 文件中定义一个函数，在我们的例子中是 OnPartialViewLoad 函数：

部分视图.js

function OnPartialViewLoad() {
    // ... your onLoad work
}
  1. 在局部视图的末尾添加一个 document.ready() 函数并调用 onLoaded 函数。

部分视图.cshtml

<script type="text/javascript">
    $(document).ready(function(){
        OnPartialViewLoad();
    });
</script>
于 2020-05-18T12:17:37.913 回答