包括局部视图JavaScript文件 [英] Include JavaScript file in partial views

查看:148
本文介绍了包括局部视图JavaScript文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道最好的做法是什么,包括局部视图内的JavaScript文件。一旦呈现,这将最终成为一个js包括在我的网页的HTML的中间变量。从我的角度来看这是不是这样做的一个很好的方式。他们属于头标记,因此不应一次过呈现HTML prevent浏览器。

I am wondering what the best practice is for including javascript files inside partial views. Once rendered this will end up as a js include tag in the middle of my page's html. From my point of view this isn't a nice way of doing this. They belong in the head tag and as such should not prevent the browser from rendering the html in one go.

一个例子:
我使用的是'PictureGallery'的局部视图内一个jQuery插件picturegallery,因为这部分观点将在多个页面中使用。这个插件只需要在使用这种观点和我不想被加载到有需要知道每个部分的视图使用的插件...

谢谢您的回答。

推荐答案

似乎非常相似,这一问题:<一href=\"http://stackoverflow.com/questions/885990/linking-javascript-libraries-in-user-controls/886184#886184\">Linking JavaScript库在用户控件

Seems very similar to this question: Linking JavaScript Libraries in User Controls

我会重新发布我的回答是这个问题在这里。

I'll repost my answer that that question here.

我肯定会建议不要把它们准确地为你所提到的原因,里面的谐音。有一个高的机会,一个视图可以用两个谐音,这两个具有相同的js文件引用拉。你还要加载JS的性能命中加载HTML的其余部分之前。

I would definitely advise against putting them inside partials for exactly the reason you mention. There is a high chance that one view could pull in two partials that both have references to the same js file. You've also got the performance hit of loading js before loading the rest of the html.

我不知道最好的做法,但我选择包括母版内的任何常见的js文件,然后定义一个单独的ContentPlaceHolder为特定于视图的特定或少数一些额外的js文件。

I don't know about best practice but I choose to include any common js files inside the masterpage and then define a separate ContentPlaceHolder for some additional js files that are specific to a particular or small number of views.

下面是一个例子母版页 - 这是pretty自我解释

Here's an example master page - it's pretty self explanatory.

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<head runat="server">
    ... BLAH ...
    <asp:ContentPlaceHolder ID="AdditionalHead" runat="server" />
    ... BLAH ...
    <%= Html.CSSBlock("/styles/site.css") %>
    <%= Html.CSSBlock("/styles/ie6.css", 6) %>
    <%= Html.CSSBlock("/styles/ie7.css", 7) %>
    <asp:ContentPlaceHolder ID="AdditionalCSS" runat="server" />
</head>
<body>
    ... BLAH ...
    <%= Html.JSBlock("/scripts/jquery-1.3.2.js", "/scripts/jquery-1.3.2.min.js") %>
    <%= Html.JSBlock("/scripts/global.js", "/scripts/global.min.js") %>
    <asp:ContentPlaceHolder ID="AdditionalJS" runat="server" />
</body>

&Html.CSSBlock放大器; Html.JSBlock显然是我自己的扩展,但再次,他们是自我解释在他们做什么。

Html.CSSBlock & Html.JSBlock are obviously my own extensions but again, they are self explanatory in what they do.

然后在说一个SignUp.aspx认为我会

Then in say a SignUp.aspx view I would have

<asp:Content ID="signUpContent" ContentPlaceHolderID="AdditionalJS" runat="server">
    <%= Html.JSBlock("/scripts/pages/account.signup.js", "/scripts/pages/account.signup.min.js") %>
</asp:Content>

HTHS,查尔斯

HTHs, Charles

诗。这里是一个跟进的问题,我问了一下污染减量和串联js文件:
<一href=\"http://stackoverflow.com/questions/890561/concatenate-minify-js-on-the-fly-or-at-build-time-asp-net-mvc\">Concatenate &安培;缩小JS在飞行或在生成时 - ASP.NET MVC

Ps. Here is a follow up question I asked about minifying and concatenating js files: Concatenate & Minify JS on the fly OR at build time - ASP.NET MVC

编辑:按照要求对我的其他答案,我的执行.JSBlock的(A,B)的要求

As requested on my other answer, my implementation of .JSBlock(a, b) as requested

public static MvcHtmlString JSBlock(this HtmlHelper html, string fileName)
{
    return html.JSBlock(fileName, string.Empty);
}

public static MvcHtmlString JSBlock(this HtmlHelper html, string fileName, string releaseFileName)
{
    if (string.IsNullOrEmpty(fileName))
        throw new ArgumentNullException("fileName");

    string jsTag = string.Format("<script type=\"text/javascript\" src=\"{0}\"></script>",
                                 html.MEDebugReleaseString(fileName, releaseFileName));

    return MvcHtmlString.Create(jsTag);
}

然后当奇迹发生......

And then where the magic happens...

    public static MvcHtmlString MEDebugReleaseString(this HtmlHelper html, string debugString, string releaseString)
    {
        string toReturn = debugString;
#if DEBUG
#else
        if (!string.IsNullOrEmpty(releaseString))
            toReturn = releaseString;
#endif
        return MvcHtmlString.Create(toReturn);
    }

这篇关于包括局部视图JavaScript文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆