在动态创建的链接中使用波浪号（〜）

我使用JavaScript动态创建包含链接和URL的子菜单项。但是，当我导航到链接时，URL不会将~解析为根目录，而只是将该字符串附加到当前URL。在动态创建的链接中使用波浪号（〜）

HTML：

<!DOCTYPE html> 
<html> 

    <body> 

     <div id="left-menu" class="sidr-hide"> 
      <ul> 
       <li><a href="~/">Home</a></li> 
       <li><a href="~/ListItem1">ListItem1</a></li> 
       <li><a href="~/ListItem2">ListItem1</a> 
        <ul id="ListItemDropdown"> 
Following items will be created Dynamically 

     @* <li><a href="~/ListItem2/?param=SubItem1">SubItem1</a></li> 
     <li><a href="~/ListItem2/?param=SubItem2">SubItem2</a></li>*@ 
     </ul> 
       </li> 

      Added here for link testing: 
       <li><a href="~/ListItem2/?param=SubItem1">SubItem1</a></li> 
       <li><a href="~/ListItem2/?param=SubItem2">SubItem2</a></li> 
      </ul> 
     </div> 

     <script src="~/Scripts/Layout.js"></script> 
    </body> 
</html>

是直接在上面，做工精细的HTML标签写的所有链接。

的JavaScript：

var ExchangeLeftDropdown = document.getElementById("ListItemDropdown"); 

$(document).ready(function() { 
var test = "Subitem1}SubItem2}"; //This string will be filled by a controller later on 
var test2 = test.split("}"); 
for (i = 0; i < test2.length; i++) { 
    //Create List Item 
    var newListItem = document.createElement("li"); 
    //Create Link Item 
    var itemLink = document.createElement("a"); 
    //Add text to link Item 
    itemLink.textContent = test2[i]; 
    //Add link URL to link Item 
    itemLink.setAttribute("href", "~/ListItem2/?dom=" + test2[i]);//Desired URL, 
    //but this tilde doesn't equate to home directory, so instead I get this 
    //in the URL http://localhost:1461/'DirectoryCurrentlyViewing'/~/ListItem2/?dom=SubItem2. 
    //it does lead to the right place if you navigate from the home directory 


    // itemLink.setAttribute("href", "<%=ResolveUrl(~/Exchange/?dom=" + test2[i] + ")%>"); 
    // This attempt resulted in me getting a 404 error vs a Server Error in '/' Application 
    //The URl is again a directly pasted string: http://localhost:1461/ListItem2/<%=ResolveUrl(~/ListItem2/?dom=SubItem2)%%> 
    itemLink.setAttribute("runat", "server"); //The attempt to parse the URL server side didn't have any effect 
    newListItem.appendChild(itemLink); 
    ExchangeLeftDropdown.appendChild(newListItem); 
} 
});

是否有链路创建我可以改变/添加或文本插入链接创建，将允许网站解析~为根目录中的任何财产？

来源

2016-02-16 Stanislav

看起来你很迷惑[ASP.NET的'〜'在路径中]（https://msdn.microsoft.com/en-us/library/ms178116.aspx）的东西，可以在HTML中使用一般。如果你想要根相关的URL，只需使用相对URL并离开'〜'。 – zzzzBov

以~代字符开头的路径在某些工具中具有特殊含义。但是，这不是URL中的情况。 ~代字号没有特殊含义，因此您的网址被解释为正常的相对网址。如果您使用的是http://example.com/a/b，并且您点击指向~c的链接，那么您将以http://example.com/a/~c而不是http://example.com/~c结束。

如果您希望将您的网址解析为主机名下的绝对路径，而不是相对网址，则需要以/开头。这被称为"path-absolute URL"。如果~应该位于最终URL中，例如Linux用户目录，则可能需要/~。如果~只是应该是一个独立于主机根，只需使用/自身：

itemLink.setAttribute("href", "/ListItem2/?dom=" + test2[i]);//Desired URL,

如果网站的根不是在主机根，但在子目录中，也没有标准的URL语法来做你想做的。这是不可能的：浏览器无法知道服务器上定义的站点结构。

来源

2016-02-16 19:15:29

谢谢，这工作完美 – Stanislav

-1

代字号在JavaScript中没有意义。尝试使用：

var hostname = window.location.href; 
itemLink.setAttribute("href", hostname + "/ListItem2/?dom=" + test2[i]);

来源

2016-02-16 19:12:36

在动态创建的链接中使用波浪号（〜）

回答

相关问题