我有一個非常基本的jQuery選項卡設置。一切工作正常，但我需要一個在URL中的散列來指定活動標籤，所以我添加了一個條件來檢查散列。現在，當頁面加載時，它實際上是激活錨點並將頁面向下移動。爲什麼不是「返回假」;加工？即使點擊函數返回false，jQuery click（）仍然會激活錨點

$(document).ready(function() { 
    $(".tabs a").click(function() { 
    $(".tabs a").removeClass("active"); 
    $(".tabs a").addClass("button secondary"); 
    $(this).attr("class","button active"); 
    var href = $(this).attr("href"); 
    $(href).parent().find("> .active").removeClass("active"); 
    $(href).addClass("active"); 
    return false; 
    }); 
    if(window.location.hash) { 
    $(".tabs a[href$='"+window.location.hash+"']").click(); 
    } else { 
    $(".tabs a:eq(0)").click(); //default to first tab 
    } 
});

這裏有一些更新：

如果我只需輸入實際的哈希值，而不是從window.location.hash拉它，它完美。

$(".tabs a[href$='#Contact2']").click();

點擊不同的標籤不移動頁面，只有當頁面加載，並自動點擊基於散列值的標籤。

如果我把一個條件，然後自動點擊不使用jQuery選擇中AA變量，它工作正常，假設位置哈希值不匹配，我點擊哈希（奇怪，我知道...）

if(window.location.hash === "#Contact2") { 
    $(".tabs a[href$='#Contact4']").triggerHandler("click"); 
} else { 
    $(".tabs a:eq(0)").click(); //default to first tab 
}

這對我來說確實沒什麼意義。似乎唯一的問題是使用jquery選擇器中的window.location.hash ...

來源

2012-03-14 Alec Sanger

你可以做'$（「選項卡的」）。單擊（'而不是做'點擊（）'內'每（）'的方式 – m90 2012-03-14 14:35:22

是的，謝謝。我已刪除它（並提出了一些其他優化） – 2012-03-14 15:12:48

嘗試preventDefault()來代替。不要忘記.click(function(e)內的e。

$(document).ready(function() { 
    $(".tabs a").each(function() { 
    $(this).click(function(e) { 
     e.preventDefault(); 
     $(".tabs a").removeClass("button secondary active"); 
     $(".tabs a").addClass("button secondary"); 
     $(this).attr("class","button active"); 
     var href = $(this).attr("href"); 
     $(href).parent().find("> .active").removeClass("active"); 
     $(href).addClass("active"); 
    }); 
    }); 
    if(window.location.hash) { 
    $(".tabs a[href$='"+window.location.hash+"']").click(); 
    } else { 
    $(".tabs a:eq(0)").click(); //default to first tab 
    } 
});

然後鏈接一些東西放在一起...

$(document).ready(function() { 
    $(".tabs a").each(function() { 
    $(this).click(function(e) { 
     e.preventDefault(); 
     $(".tabs a").removeClass("button secondary active").addClass("button secondary"); 
     $(this).attr("class","button active"); 
     var href = $(this).attr("href"); 
     $(href).parent().find("> .active").removeClass("active") 
     $(href).addClass("active"); 
    }); 
    }); 
    if(window.location.hash) { 
    $(".tabs a[href$='"+window.location.hash+"']").click(); 
    } else { 
    $(".tabs a:eq(0)").click(); //default to first tab 
    } 
});

我不知道你在這裏做什麼？

 $(".tabs a").removeClass("button secondary active") 
     $(".tabs a").addClass("button secondary");

第二行瞬間增加了兩個你用第一行刪除的類。

來源

2012-03-14 14:50:01 Sparky

是，代碼肯定可以使用一些優化。這只是我從某個地方的例子中獲得的東西。所述e.preventDefault（），不幸的是，確實不防止錨固從向下滾動到具有相同ID的股利。你對removeClass/addClass冗餘完全正確。謝謝你指出。 – 2012-03-14 15:11:08

'e.preventDefault（）'在jQuery處理程序中不做任何事情，_unless由於某種原因在'return false'行之前拋出異常。 – Alnitak 2012-03-14 15:39:40

這是特殊的，因爲它可以防止當我手動點擊時發生默認錨定函數，但不是當我基於散列值自動點擊時發生。我的控制檯日誌中沒有錯誤。 – 2012-03-14 16:19:22

你的方法是非常遞歸的。儘量避免在集合中運行集合。

以下是jQuery 1.7+實現中的一些片段，可能會做你所需要的。

...初始化

$(body).on("click", ".tabs a", { }, _selectTab);

...一些功能

_selectTab : function(event) { 
    $(".tabs a").removeClass(selected); // clear all matches. 
    $(event.currentTarget).addClass(selected); // something like that. 
}

來源

2012-03-14 15:09:51

代替.click()使用.triggerHandler("click")

而且，你的點擊處理程序需要一個e事件參數，您需要撥打e.preventDefault()而不是老學校return false。

最後，而不是if(window.location.hash)使用if(window.location.hash.length > 0)

來源

2012-03-14 15:42:25

.triggerHandler以及e.preventDefault給了我同樣的問題。當我手動點擊或自動點擊第一個選項卡時，它們會工作，但是當自動點擊基於散列值的選項卡時，頁面仍會移動。 – 2012-03-14 16:20:42

@ Eclyps19看到我最近的編輯，它可能對你有所幫助 – 2012-03-14 17:50:25

沒有骰子。點擊的效果與預期的一樣，但是當頁面與當前的window.location.hash相匹配時，該頁面仍然會切換到div。不過謝謝你。 – 2012-03-14 18:07:46

也許也該代碼應該讓你的工作：

$(".tabs a").click(function(){ 
      // your code 
      return false; 
});

另一種方法是：

$(".tabs a").click(function(e) { 
    e.preventDefault(); 
    // your code 
});

來源

2012-03-14 15:49:05 antonjs

純JavaScript解決方案停止所有哈希默認點擊

var a_tag = document.getElementsByTagName('a'); for (var i = 0; i < a_tag.length; i++) { a_tag[i].addEventListener('click', function (e) { var lastChar = this.href.substr(this.href.length - 1); if (lastChar == "#") { e.preventDefault(); } }, false); }

來源

2015-09-09 08:01:03

即使點擊函數返回false，jQuery click（）仍然會激活錨點

這裏有一些更新：

回答

相關問題