内部和外部链接之间的差异

我有一个图像，当点击后，重定向到另一个页面。我需要一种方法来知道链接是内部的（应用程序页面）还是外部链接。如果链接是外部的，我希望它弹出一个新的标签，如果它是内部弹出在同一个标签。内部和外部链接之间的差异

这是代码部分。

<a class="lnkImage" href="@item.ImageURL" target="_blank"> 
    <img id="PrivateimgPreview" src="@item.ActualImage" /> 
</a>

ImageURL和实际图像来自模型。基本上我想要这个功能。

if(External) 
{ 
    <a class="lnkImage" href="@item.ImageURL" target="_blank"> 
     <img id="PrivateimgPreview" src="@item.ActualImage" /> 
    </a> 
} 
else if(internal) 
{ 
    <a class="lnkImage" href="@item.ImageURL"> 
     <img id="PrivateimgPreview" src="@item.ActualImage" /> 
    </a> 
}

我意识到，通过使用Request.Url.Host我可以得到主机和比较，但是这将意味着硬编码，并会在不同的主机进行更改。有没有办法一般地在视图中找出@ item.ImageURL的域？

UPDATE：我可以为我的网站的域和控制器中的@ item.ImageURL的域做Request.URL，并在我的模型中设置一个布尔值，但是我有4个这样的部分。一个图像链接，一个图像标题，一个图像细节等等。所以这会让我介绍4个新的模型对象，将它们中的每一个都设置在控制器中。所以我希望它有可能在视图中进行比较。

来源

2016-11-22 TheFallenOne

你基本上需要比较每个图像'Request.Url.Host'和'item.ImageURL'。如果它们不同（链接是外部的），则将属性添加到图像链接'target =“_ blank”'。 – myroman

请检查这一个。它使用indexOf将href与window.location.origin进行比较。如果它被发现，它改变了window.location = href，如果没有它会触发anchor.click()

var ls = Array.from(document.querySelectorAll(".lnkImage img")); 
 
ls.forEach(function(l) { 
 
    l.addEventListener('click', function(e) { 
 
    var ori = window.location.origin; 
 
    var hr = this.parentNode.href; 
 
    if (hr.indexOf(ori) >= 0) { 
 
     window.location = hr; 
 
     console.log('internal'); 
 
    } else { 
 
     this.parentNode.click(); 
 
     console.log('external'); 
 
    } 
 
    }) 
 
})

<!--internal--> 
 
<a class="lnkImage" href="http://stacksnippets.net" target="_blank"> 
 
    <img id="PrivateimgPreview" src="@item.ActualImage" /> 
 
</a> 
 

 
<!--external--> 
 
<a class="lnkImage" href="http://othersite.com/test" target="_blank"> 
 
    <img id="PrivateimgPreview" src="@item.ActualImage" /> 
 
</a>

来源

2016-11-22 15:20:45 RizkiDPrast

我的答案是基于服务器。用模型填充视图的控制器比较每个图像项目.ImageURL主机与当前的Request.Url.Host。如果它们不同（链接是外部的），则添加属性到图像链接target =“_ blank”，如果相同 - 则添加target =“_ self”。请参阅下面的示例代码，您可以根据自己的需求轻松调整它。

//controller 
public ActionResult Index() { 
    var model = new CustomModel { 
    ImageItems = GetImageItems() 
    }; 
    //set link target for view based on image url 
    foreach (var imageItem in model.ImageItems) { 
    imageItem.LinkTarget = GetLinkTarget(imageItem.ImageURL); 
    } 
    return View(model); 
} 

private string GetLinkTarget(string linkUrl) { 
    var url = new Uri(linkUrl); 
    return url.Host == Request.Url.Host ? "_self" : "_blank"; 
} 

//view 
<div> 
@{ 
    foreach (var imageItem in Model.ImageItems) { 
     <a class="lnkImage" href="@imageItem.ImageURL" target="@imageItem.LinkTarget"> 
      <img id="PrivateimgPreview" src="@item.ActualImage" /> 
     </a> 
    } 
} 
</div>

来源

2016-11-22 15:26:26 myroman

内部和外部链接之间的差异

回答

相关问题