哈希位置基礎知識

Question

我試圖理解location.hash在jQuery中是如何工作的，為此，我試圖從最基本的形式開始，然后一旦我做對了，我就會更深入，但遺憾的是我已經陷入困境我認為應該是一件簡單的事情。

這是我創建的代碼，修改了我在帖子中找到的其他人的代碼：

$(document).ready(function(){

$("body").css("background-color", "#FF0");

$(window).bind( 'hashchange', function( event ) {

    if (window.location.hash == "red"){
        $("body").addClass("red");
    } else if (window.location.hash == "green") {
        $("body").addClass("green");
    }

    event.preventDefault();

});

$(window).trigger("hashchange");

}）;

這是http://dlacrem.16mb.com/dlatest/hash.html頁面

現在，正如我所說的那樣，我正在努力學習，因此在10行中可能有80個錯誤：但是，當我去hash.html＃red時，不應該將紅色類添加到正文中嗎？

我正在使用Ben Alman的BBQ插件

此致，感謝您的幫助！

Answer 1

window.location.hash包含哈希符號。

if (window.location.hash == "#red"){
    $("body").addClass("red");
} else if (window.location.hash == "#green") {
    $("body").addClass("green");
}

此外，您設置為使主體變為黃色的內聯樣式將覆蓋您對類執行的任何操作（除非您使用！重要，但不要這樣做！），因此您需要在樣式表中將其設置為黃色而不是內聯。

http://jsfiddle.net/4SwnQ/

但是你會注意到，一旦你把它變成紅色，然后變成綠色，它會保持綠色。 這是因為你從來沒有真正刪除過類，因此它具有最高特異性的類（在這種情況下為綠色，因為它在樣式表中是最后一個。）為了解決這個問題，你還需要刪除另一個類。

http://jsfiddle.net/4SwnQ/1/