MVC4 部分视图 javascript 捆绑问题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11257940/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 12:34:52  来源:igfitidea点击:

MVC4 partial view javascript bundling Issue

javascriptasp.net-mvc-4asp.net-optimizationbundling-and-minification

提问by martin

I am working on a project ASP.net 4, MVC4(RC) using visual studio 11. I am trying to render an MVC4 Razor view that renders a partial view. I have some javascript required for my partial view. On my partial view when I include my javascript inside the scripts section as follows it does not seem to load.

我正在使用 Visual Studio 11 处理一个项目 ASP.net 4, MVC4(RC)。我正在尝试呈现一个呈现局部视图的 MVC4 Razor 视图。我的部分视图需要一些 javascript。在我的部分视图中,当我在脚本部分中包含我的 javascript 时,它似乎没有加载。

@section Scripts {
    <script type="text/javascript">
        $(function () {
            alert("test");
        });
    </script>
}

If I remove the scripts section it fails as the jquery libraries (which are bundled and rendered on my _Layout.cshtml page) have not yet loaded when the document ready code runs.

如果我删除脚本部分,它会失败,因为当文档就绪代码运行时,jquery 库(捆绑并呈现在我的 _Layout.cshtml 页面上)尚未加载。

<script type="text/javascript">
    $(function () {
        alert("test");
    });
</script>

_Layout Page code to load jquery libraries

_Layout 页面代码加载 jquery 库

@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)

Does anyone know of a solution for this, or am I simply going about it the wrong way? Its wrecking my head!!

有没有人知道解决方案,或者我只是以错误的方式解决它?它破坏了我的头!

回答by Darin Dimitrov

Don't wrap your script in a document.readyin the partial:

不要将您的脚本包装document.ready在部分中的 a中:

@section Scripts {
    <script type="text/javascript">
        alert("test");
    </script>
}

Ah, and don't put scripts in partials. Javascript code should be placed in separate javascript files. If you want to execute some javascript when a partial is loaded, you simply externalize this script into a reusable function/plugin that you call once your partial is loaded.

啊,不要把脚本放在部分中。Javascript 代码应该放在单独的 javascript 文件中。如果您想在加载部分时执行一些 javascript,您只需将此脚本外部化为一个可重用的函数/插件,您在加载部分后调用该函数/插件。

回答by martin

Finally got this to work. I removed my javascript from my partial view and placed it in the parent view (which is not partial), in the script section.This scripts section was created automatically when creating the view with scaffolding (Create) and was placed at the end of the page. To get this to work I had to move it to the top of the page - before the call to render my partial.

终于让这个工作了。我从我的局部视图中删除了我的 javascript 并将其放置在父视图(不是局部视图)的脚本部分中。此脚本部分是在使用脚手架(创建)创建视图时自动创建的,并放置在页。为了让它工作,我必须将它移到页面顶部 - 在调用渲染我的部分之前。

回答by JohnB

ClientDependencysolves exactly this problem and allows you to add script references to partial views that get rolled up and placed at the end of the page (or wherever you specify) for you. It also deals with bundling, versioning and minification page by page.

ClientDependency正好解决了这个问题,并允许您向部分视图添加脚本引用,这些视图被卷起并放置在页面末尾(或您指定的任何地方)。它还逐页处理捆绑、版本控制和缩小。

The overhead of ensuring the script reference is on the "parent" View rather than the partial doesn't really bother me, but Client Dependency could be helpful if you had loads of partials all requiring their own script and CSS.

确保脚本引用在“父”视图而不是局部视图上的开销并没有真正困扰我,但是如果您有大量的局部视图都需要自己的脚本和 CSS,则客户端依赖关系可能会有所帮助。