asp.net-mvc ASP.NET MVC 中的 CSS 和 Javascript 相对路径混淆

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/435769/
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-09-07 23:16:35  来源:igfitidea点击:

CSS and Javascript relative path confusion in ASP.NET MVC

asp.net-mvc

提问by Edward Tanguay

My javascript paths work on this page: http://localhost:53049/

我的 javascript 路径在此页面上工作: http://localhost:53049/

But not on this page: http://localhost:53049/Home/Messages

但不在此页面上: http://localhost:53049/Home/Messages

The reason is that the relative paths are different, the former requires ("js/...") and the latter requires ("../../js/...").

原因是相对路径不同,前者需要("js/..."),后者需要("../../js/...")。

I'm including my javascript in my Site.Master file:

我将我的 javascript 包含在我的 Site.Master 文件中:

<script type="text/javascript" src="js/jquery.jqGrid.js"></script>
<script type="text/javascript" src="~/js/jquery.jqGrid.js"></script>
<script type="text/javascript" src="<%= this.ResolveClientUrl("~/Scripts/jquery-1.2.6.js") %>"></script>

How do I get around this relative path madness, i.e. what is the best practice way in ASP.NET MVC to set CSS/Javascript paths in the Site.Master so that they work for each view no matter how deep that view's URL happens to be.

我如何绕过这种相对路径的疯狂,即 ASP.NET MVC 中在 Site.Master 中设置 CSS/Javascript 路径的最佳实践方法是什么,以便它们适用于每个视图,无论该视图的 URL 有多深.

ADDENDUM:

附录:

It seems that for the Index view, any path will work, strangely:

似乎对于索引视图,任何路径都可以工作,奇怪的是:

<script type="text/javascript" src="/Scripts/jquery-1.2.6.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-1.2.6.js"></script>
<script type="text/javascript" src="../../../Scripts/jquery-1.2.6.js"></script>

But for any other pages (pages with a deeper URL), none of these work.

但是对于任何其他页面(具有更深 URL 的页面),这些都不起作用。

What's going on here? How can we set the Javascript path once in Site.Master and they work for all pages?

这里发生了什么?我们如何在 Site.Master 中设置一次 Javascript 路径并且它们适用于所有页面?

ADDENUM II:

附录二:

It turned out to only be a problem with the jqgrid javascript file (not the jquery file), apparently inside that file it is referencing other javascript files and gets confused:

结果证明只是 jqgrid javascript 文件(不是 jquery 文件)的问题,显然在该文件中它引用了其他 javascript 文件并感到困惑:

<script type="text/javascript" src="<%= Url.Content ("~/js/jquery.jqGrid.js") %>"></script>

采纳答案by Kieron

You can also use the Url.Content method call to make sure that the paths are correctly set.

您还可以使用 Url.Content 方法调用来确保路径设置正确。

Examples can be found here.

可以在此处找到示例。

回答by Ropstah

Regarding paths used in CSS documents:

关于 CSS 文档中使用的路径:

/Content/site.css

/内容/site.css

Body {background-image:url('background.jpg');}

Relative paths in CSS documents are related to the CSS document, not the document being displayed.

CSS 文档中的相对路径与 CSS 文档相关,而不是与正在显示的文档相关。

This information saved me some headaches.

这些信息让我有些头疼。

回答by jacobangel

Try setting the javascript to use a forward slash at the beginning, like "/js/jquery.jqGrid.js" This will set them to use the root domain instead of relative pathing.

尝试将 javascript 设置为在开头使用正斜杠,例如“/js/jquery.jqGrid.js”。这会将它们设置为使用根域而不是相对路径。

回答by Daniel Earwicker

The solution for jqGrid: open the file jquery.jqGrid.js and locate the line:

jqGrid的解决方法:打开文件jquery.jqGrid.js,定位到一行:

var pathtojsfiles = "js/"; // need to be ajusted

As the comment says, you need to edit that path, e.g. for a typical ASP.NET MVC app,

正如评论所说,您需要编辑该路径,例如对于典型的 ASP.NET MVC 应用程序,

var pathtojsfiles = "/Scripts/js/"; // need to be ajusted

回答by Samir Ahmed

You need to add runat="server"and to specify the absolute path like this:

您需要添加runat="server"并指定绝对路径,如下所示:

<script type="text/javascript" runat="server" src="~/js/jquery.jqGrid.js"></script>]

<script type="text/javascript" runat="server" src="~/js/jquery.jqGrid.js"></script>]