菜單具有“滾動到#href”功能，但無法在其中使用_target空白鏈接

Question

我的問題是我的導航欄具有滾動鏈接功能，因為我的網站位於一頁內。

但是我嘗試向菜單添加一個新鏈接，並帶有一個外部鏈接（不在同一頁面中）。

當我單擊它時，它不會打開鏈接（我假設jQuery腳本嘗試滾動到它而不是打開...）

我應該如何解決它或添加例外？

這是html：

<ul class="menyy">
                    <li><a href="#info">Mis on Rahapuu?</a></li>
                    <li><a href="#kkk">KKK</a></li>
                    <li><a href="#meist">Kes me oleme?</a></li>
                    <li><a href="http://rahapuu.eu/laenud/" target="_blank">Laenud</a></li>
                    <li><a href="#kontakt">Kontakt</a></li>
                </ul>  

這是用於平滑滾動的jQuery腳本：

//smooth scroll to href value
            jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").click(function(event){
                 event.preventDefault();
                 //calculate destination place
                 var dest=0;
                 if($(this.hash).offset().top > $(document).height()-$(window).height()){
                      dest=$(document).height()-$(window).height();
                 }else{
                      dest=$(this.hash).offset().top;
                 }
                 //go to destination
                 jQuery('html,body').animate({scrollTop:dest}, 1000,'swing');
             });

有什么建議嗎？

Answer 1

您可以對其進行過濾，使其僅包含具有基於散列的鏈接的錨點

jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").filter('[href^=#]').click(function(event){ ...

Answer 2

由於其他人不願意添加一個類（到目前為止，這是最好的方法，但是我建議您全面應用該類並簡化選擇器），我想我會提供一個通用的替代方案，需要修改HTML（以防您因某些原因而無法）：

$(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").filter(function(){
    return (!this.target || this.target !== '_blank');
}).click(function(e){
    e.preventDefault();

    //calculate destination place
    var dest = 0,
        htDiff = $(document).height() - $(window).height(),
        hashOffset = $(this.hash).offset().top;

    if(hashOffset > htDiff){
        dest = htDiff;
    } else {
        dest = hashOffset;
    }

    //go to destination
    $('html,body').animate({scrollTop:dest}, 1000,'swing');
});

這只會將您原始的對象集合過濾為沒有列出目標或沒有目標值為_blank 。 我還自由地緩存了您的計算，因為您多次使用它們。

Answer 3

您可以給所有其他人一個class名，而忽略鏈接

    <ul class="menyy">
        <li><a class="yourclass" href="#info">Mis on Rahapuu?</a></li>
        <li><a class="yourclass" href="#kkk">KKK</a></li>
        <li><a class="yourclass" href="#meist">Kes me oleme?</a></li>
        <li><a href="http://rahapuu.eu/laenud/" target="_blank">Laenud</a></li>
        <li><a class="yourclass" href="#kontakt">Kontakt</a></li>
    </ul>

並更改為：

jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a .yourclass").click(function(event){