如何在新選項卡中打開特定的菜單div

Question

我創建了一個單頁網站。 當我單擊菜單時，它會轉到特定的div標簽。 當我右鍵單擊菜單並單擊“在新選項卡中打開”時，它會打開URL“ www.mysite.com/#”，而應打開“ www.mysite.com/#show-3”。

請盡快幫我...

 /**************Script used to open Different menu div on page*********************/ $(".menu a").click(function(){ var id = $(this).attr('class'); id = id.split('-'); $("#menu-container .content").hide(); $("#menu-container #menu-"+id[1]).addClass("animated fadeInDown").show(); return false; }); 

 <div class="menu-wrapper"> <ul class="menu"> <li><a class="show-1" class="MENUNAME" href="#" onclick="javascript:myFunction(this);">About Us</a></li> <li><a class="show-2" class="MENUNAME" href="#" onclick="javascript:myFunction(this);">Rooms</a></li> <li><a class="show-3" class="MENUNAME" href="#" onclick="javascript:myFunction(this);">Reservation</a></li> <li><a class="show-4" class="MENUNAME" href="#" onclick="javascript:myFunction(this);">Gallery</a></li> <li><a class="show-5" class="MENUNAME" href="#" onclick="javascript:myFunction(this);">Contact Us</a></li> </ul> <!-- /.menu --> </div> 

Answer 1

這會起作用

<a target="_blank" href="yourlink">Link</a>

就你而言

 <div class="menu-wrapper"> <ul class="menu"> <li><a target="_blank" class="show-1" href="#">About Us</a></li> <li><a target="_blank" class="show-2" href="#">Rooms</a></li> <li><a target="_blank" class="show-3" href="#">Reservation</a></li> <li><a target="_blank" class="show-4" href="#">Gallery</a></li> <li><a target="_blank" class="show-5" href="#">Contact Us</a></li> </ul> <!-- /.menu --> </div> 

Answer 2

大多數瀏覽器中的“在新標簽頁中打開”按鈕將遵循標准的超鏈接規則，這意味着它們將打開標記的href。 一頁站點通常使用javascript和動態html生成來管理所有內容。 在新標簽頁中打開功能不知道該如何處理。

您要做的是編寫路由和html生成邏輯，為所有鏈接提供實際的href屬性，而不僅僅是標簽。 對於正常的頁面導航，只要用戶單擊鏈接，您就可以執行常規的一頁邏輯，但您可以返回false，但是當有人強迫瀏覽器導航到href位置時（如在新標簽頁中打開），您可以將會有一個實際的頁面，其中顯示了您的div。

Answer 3

請嘗試這個小提琴演示

只需對標簽做些小改動

<a href="#" target="_blank">

Answer 4

您可以給div ID：

<div id="show-1">About Us Content</div>

並創建如下超鏈接：

<a class="show-1" target="_blank" href="yourPage.html#show-1">About Us</a></li>

這將直接在新標簽中打開div。

Answer 5

關於您要執行的操作的問題是，如果您只想在新網頁中打開特定的div，則它不再是1頁的網站。 這是具有該div內容的新頁面。

關於您的代碼，

... href="your new page link here"

您的“＃”是鏈接（或更確切地說，它將將該鏈接附加到您當前頁面上的基本URL中。導致該鏈接轉到“ www.mysite.com/#”顯示同一頁面而不是僅顯示一個新頁面，僅僅是因為＃在任何事件（例如onclick）上，不是鏈接到新頁面而是鏈接到當前頁面中的元素，您可以在此處獲取更多詳細信息

但是，就像前面提到的其他答案一樣，如果要打開新標簽頁（又稱頁面），則必須有另一個頁面。 這也意味着這將不再是一個1頁的網站。