ASP.NET MVC 中 CSS 和 JavaScript 相对路径混淆问题

Question

我的 JavaScript 路径在这个页面上可以工作： http://localhost:53049/

但是在这个页面上不行： http://localhost:53049/Home/Messages

原因是相对路径不同，前一个需要 ("js/...")，而后一个需要 ("../../js/...")。

我正在 Site.Master 文件中引入我的 JavaScript：

<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>

我应该如何解决相对路径混乱的问题？即，在ASP.NET MVC中，如何以最佳实践的方式设置Site.Master中的CSS/JavaScript路径，以便它们适用于每个视图，无论该视图的URL有多深。

补充说明：

奇怪的是，对于Index视图，任何路径都有效：

<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>

但是对于任何其他页面（具有更深层次的URL的页面），这些方法都不起作用。

发生了什么？我们如何在Site.Master中一次设置Javascript路径，使其适用于所有页面？

ADDENUM II:

事实证明，这只是jqgrid javascript文件（而不是jquery文件）的问题，显然该文件内部引用了其他javascript文件并且变得混乱：

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

- Edward Tanguay

---

我们无法看到从您的本地主机发布的内容。 - jacobangel

三个笑脸 - 我甚至没有注意到 - annakata

我知道（希望）你无法在我的本地机器上看到它们，我只是不知道如何使用这个编辑器使http的非链接。关键是，如果URL中有目录，路径就无法正常工作。 - Edward Tanguay

关于 Index 视图的观点很好，因为一切似乎都正常工作，直到您移动到另一个操作。 - JustinStolle

Answer 1

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

示例可以在这里找到。

- Kieron

Answer 2

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

/Content/site.css

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

CSS文档中的相对路径是相对于CSS文档本身而言的，而不是被显示文档相对于自己的。

这个信息让我避免了一些麻烦。

- Ropstah

Answer 3

尝试将javascript设置为以斜杠开头，例如"/js/jquery.jqGrid.js"。这将使它们使用根域名而不是相对路径。

- jacobangel

---

当然，这只有在文件真正存在于站点根目录之外的位置才能起作用。例如，在虚拟目录中进行开发，但在根目录部署会导致此方法在开发过程中失败。 - Sean Carpenter

Answer 4

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

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

- Samir Ahmed

Answer 5

jqGrid的解决方案：打开文件jquery.jqGrid.js并找到以下行：

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

就像注释所说的那样，您需要编辑该路径，例如对于典型的ASP.NET MVC应用程序：

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

- Daniel Earwicker

---

当在虚拟目录/应用程序中本地运行时，URL 将为 /MyApp/Scripts/js/。那么有什么建议吗？我不想把 js 文件转换成视图，只是为了使用 URL.Content，而且我也不太喜欢依赖于 lmhosts 等的更改。有其他替代方案吗？ - Yonatan Karni

简短回答：我转而使用slickgrid，它没有这个问题。 - Daniel Earwicker