Javascript導航外部鏈接

我需要你的幫助了。我有一個保存導航的功能區。它並沒有真正做任何事情，它只是「切換」活動/可見的鏈接，沒關係。不過，如果用戶點擊外部鏈接（例如，profile-nav中的第三個li），他會將其帶到鏈接中的網址，但我希望這樣做。非常感謝你！Javascript導航外部鏈接

HTML：

<div class="ribbon"> 
    <nav> 
     <ul class="profile-nav"> 
       <li class="active"><a href="#" title="My Account">My Account</a></li> 
       <li><a href="#" title="Login">Login</a></li> 
       <li><a href="http://www.google.com" title="External link">External link</a></li> 
     </ul> 
     <ul class="lang-nav"> 
      <li class="active"><a href="#" title="English (US)">English (US)</a></li> 
      <li><a href="#" title="English (UK)">English (UK)</a></li> 
      <li><a href="#" title="Deutsch">Deutsch</a></li> 
      <li><a href="#" title="Italiano">Italiano</a></li> 
      <li><a href="#" title="Русский">Русский</a></li> 
     </ul> 
     <ul class="currency-nav"> 
      <li class="active"><a href="#" title="$US Dollar">$US Dollar</a></li> 
      <li><a href="#" title="€ Euro">€ Euro</a></li> 
      <li><a href="#" title="£ Pound">£ Pound</a></li> 
     </ul> 
    </nav> 
</div>

JAVASCRIPT

$(document).ready(function() { 
     $('.ribbon li').hide(); 
    $('.ribbon li.active').show(); 
    $(".ribbon li a").click(function() { 
     $(".ribbon li").hide(); 
     if ($(this).parent().parent().hasClass('open')) 
      $(this).parent().parent().removeClass('open'); 
     else { 
      $(".ribbon ul").removeClass('open'); 
      $(this).parent().parent().addClass('open'); 
     } 
     $(this).parent().siblings().each(function() { 
      $(this).removeClass('active'); 
     }); 
     $(this).parent().attr('class', 'active'); 
     $('.ribbon li.active').show(); 
     $('.ribbon ul.open li').show(); 
     return false; 
    }); 
});

來源

2013-04-03 Ajak Glisic

有你想要的達到的許多方面。遵循你的方法，我會建議將一個class="nolink"添加到你不需要遵循外部鏈接的錨。之後，將點擊事件綁定到相應的「a.nolink」。

產生的HTML代碼如下所示：

<div class="ribbon"> 
    <nav> 
     <ul class="profile-nav"> 
      <li class="active"><a href="#" class="nolink" title="My Account">My Account</a></li> 
      <li><a href="#" class="nolink" title="Login">Login</a></li> 
      <li><a href="http://www.google.com" title="External link">External link</a>   </li> 
     </ul> 
     <ul class="lang-nav"> 
      <li class="active"><a href="#" class="nolink" title="English (US)">English (US)</a></li> 
      <li><a href="#" class="nolink" title="English (UK)">English (UK)</a></li> 
      <li><a href="#" class="nolink" title="Deutsch">Deutsch</a></li> 
      <li><a href="#" class="nolink" title="Italiano">Italiano</a></li> 
      <li><a href="#" class="nolink" title="Русский">Русский</a></li> 
     </ul> 
     <ul class="currency-nav"> 
      <li class="active"><a href="#" class="nolink" title="$US Dollar">$US Dollar</a></li> 
      <li><a href="#" class="nolink" title="€ Euro">€ Euro</a></li> 
      <li><a href="#" class="nolink" title="£ Pound">£ Pound</a></li> 
     </ul> 
    </nav> 
</div>

和JavaScript綁定你的元素：

$(".ribbon li a.nolink").click(function() { ...

來源

2013-04-03 12:32:38

非常感謝你。 –

不客氣。如果真的有幫助，請將其標記爲正確答案（在我的答覆旁邊的檢查中）。你應該對另一個問題[你在這裏發佈]做同樣的事情（http://stackoverflow.com/questions/15678511/opening-tab-with-anchor-link）。 Stackoverflow是一個聲譽社區，這樣做可以幫助我和你一樣。乾杯。 –

Javascript導航外部鏈接

回答

相關問題