如何将带有波浪的相对路径渲染成././ jquery/javascript的相对路径

本文关键字：路径 相对 jquery javascript | 更新日期: 2023-09-27 18:08:19

嗯，我知道我的标题有点令人困惑。我将在下面的例子中清楚地说明这一点。

<asp:ImageButton ID="imgButton" NavigateUrl="~/Presentation/Resources/Images/addFile.png" runat="server" />
在html中，上面的控件将呈现为 
<input type="image" name="imgButton" id="imgButton" src="../../Resources/Images/addFile.png" style="border-width:0px;">

我注意到，它会将src从"~"转换为"../.. "/" . it ' s auto arrange it ' s file level.

所以在javascript中，我想用这个url来设置控件:

~/演示/资源/图片/PDF.png

不幸的是，在HTML中它会被呈现为 
<input type="image" name="imgButton" id="imgButton" src="~/Presentation/Resources/Images/addFile.png" style="border-width:0px;">

我的问题是，我应该写什么，如果我想得到"…/…"我已经试过了，但是我不懂。

<script type="javascript">
document.getElementById("<%= imgButton.ClientID %>").src = 
"~/Presentation/Resources/Images/PDF.png";
</script>

如何将带有波浪的相对路径渲染成././ jquery/javascript的相对路径

试试:http://weblogs.asp.net/joelvarty/archive/2009/07/17/resolveurl-in-javascript.aspx

在站点的母版页中，输入:

<script type="text/javascript">
        var baseUrl = "<%= ResolveUrl("~/") %>";
</script>

然后，在你的javascript文件中，放入这个函数:

function ResolveUrl(url) {
    if (url.indexOf("~/") == 0) {
        url = baseUrl + url.substring(2);
    }
    return url;
}

你可以把函数放在母版页，但是你在你剩下的代码中不会得到智能感知。现在你可以用~/从javascript中调用ResolveUrl

为什么在客户端需要这个?使用servercontrols(runat=server)，您可以使用波浪来解析服务器上的URL。

实际上，带有波浪的URL可以通过以下方法转换为绝对URL:ResolveURL和ResolveClientURL

因此你应该能够这样做:

<input type="image" name="imgButton" id="imgButton" src="<%=this.ResolveClientUrl("~/Resources/Images/addFile.png")%>" style="border-width:0px;">

(这实际上是自动为您在Web控件，如超链接等)

当你使用User-controls时，这两个方法的最大区别就出现了。在一种情况下，URL指的是相对于用户控件所在文件夹的URL，在另一种情况下，URL指的是包含用户控件的页面。

参见这个问题:控制。ResolveUrl和Control。ResolveClientUrl vs VirtualPathUtility。ToAbsolute

看一下VirtualPathUtility类和msdn中关于ASP的信息。. NET项目路径。

VirtualPathUtility。

VirtualPathUtility。ToAppRelative

如果应用程序的虚拟路径为"myapp"，则虚拟路径为路径"/myApp/sub/default.asp"被传递给toappreative方法，生成的应用程序相对路径是"~/sub/default.aspx"。

它解释并给出了如何在不同的路径格式之间转换的示例。

我也认为你应该在服务器级输出正确的路径，而不是在浏览器中用javascript进行逆向工程。这可能会导致问题，如果你重新安排你的项目和asp改变它。

WebControls在渲染html之前在服务器上运行时将斜线转换为正确的路径，如果您正在动态更改src，则需要使用jQuery中的完整路径或相对路径。

你可能想在页面上有一个带有根路径的属性，例如:ApplicationRootURL，然后像这样做:

<script type="javascript">
document.getElementById("<%= imgButton.ClientID %>").src = 
"<%=ApplicationRootURL%>/Presentation/Resources/Images/PDF.png";
</script>
相关文章：