內部和外部鏈接之間的差異

我有一個圖像，當點擊後，重定向到另一個頁面。我需要一種方法來知道鏈接是內部的（應用程序頁面）還是外部鏈接。如果鏈接是外部的，我希望它彈出一個新的標籤，如果它是內部彈出在同一個標籤。內部和外部鏈接之間的差異

這是代碼部分。

<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

內部和外部鏈接之間的差異

回答

相關問題