用 JQuery 更改 img src 但保持路径信息完好无损？

Question

我正在使用 JQuery 来切换图像 src：

$("#myImg").attr("src", "../../new.gif");

注意新 src 上的相对路径。不幸的是，当我部署我的应用程序时，这不是可移植的。在我的 MVC 应用程序中，我使用了 ResolveUrl() 方法，该方法将为我解决路径问题，因此它是可移植的，但现在我的 JQuery 图像 src 交换器无法正常工作，因为它现在将正确解析的路径切换到损坏的相对路径.

<img id="myImg" src="<%=ResolveUrl("~/Images/transparent.gif")%>" />

我想要的是让 JQuery 只翻转实际文件名并保持路径不变。我的第一个想法是

// pseudocode javascript jquery on my thought on how to approach this prob
var oldFullPath = $('#myImg").GetTheImgSrc;
var newFileNameWithPathIntact = someRegexAddNewFileNameWithOldPath
$("#myImg").attr("src", newFileNameWithPathIntact);

但这对我来说似乎相当粗俗和非 JQuery。谁有更好的方法？

Answer 1

你可以使用这样的东西：

var oldImage =$("#myImg").attr("src");
var imagePath = oldImage.slice(0, oldImage.lastIndexOf("/")) + "/new.gif";
$("#myImg").attr("src", imagePath ); 

编辑：更好的代码...:)

Answer 2

您可以在 javascript 中使用 resolveurl：

$("#myImg").attr("src", "<%=ResolveUrl("~/Images/new.gif")%>");

这当然假设您已经在视图中包含了 javascript。如果您要求此脚本必须位于与 html 请求不同的脚本文件中，那么您可以只查看 is javascript 文件的视图...并在脚本中引用该 URL来源：

<script language="javascript" src="<%= Url.Action("MyMethod") %>" />

Answer 3

为什么不将变量用于可用于这些类型情况的应用的根目录。

var root = "<%=ResolveUrl("~/") %>";

现在您可以轻松构建图像路径

$("#myImg").attr("src", root + "images/" + fileName);