ajax導航內的jquery ajax導航

Question

我使用此代碼爲我的主站點導航，它通過ajax加載每個頁面並具有後備。

$(function() { 
    var newHash = '', 
     $contentWrap = $("#content-wrap"); 
    $("nav").on("click", "a", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 
    $(window).on('hashchange', function() { 
     newHash = window.location.hash.substring(1); 
     $contentWrap.load(newHash + " #content"); 
    }); 
    $(window).trigger('hashchange'); 
});​ 

這工作得很好，但是當我在內容加載例如從另一個頁面about.html我也裝載在了幾個鍵，導航＃內容包內。

so＃content-wrap現在包含一個數據框和一些更多用於導航的按鈕。當我點擊新導航時，它需要在數據框中加載新數據。

首先，我試圖複製上面的腳本，但與新的錨點，但是我得到一個衝突。

我想我需要某種if語句，我已經研究過類似if（function！== undefined）的東西，但不知道該怎麼做。

我不知道我有多好解釋自己，我很困惑解釋它，但基本上我想結合上面的代碼基本上相同的代碼下面沒有衝突。

$(function() { 
    var newHash = '', 
     $contentWrap = $("#content-wrap"), 
     $aboutWrap = $("#a-wrap"); 
    $("#content-wrap").on("click", "a", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 
    $(window).on('hashchange', function() { 
     newHash = window.location.hash.substring(1); 
     $aboutWrap.load(newHash + " #a-content"); 
    }); 
    $(window).trigger('hashchange'); 
});​ 

更新：樣的作品了一點，但改變了計劃

$(function() { 

var newHash = '', 
     $nav = $("nav a"), 
     $boxBtn = '', 
     $aboutWrap = '', 
     $contentWrap = $("#content-wrap"); 

$("nav").on("click", "a", function() { 

    $(this).addClass("nav-click"); 

    window.location.hash = $(this).attr("href"); 

    return false; 
}); 

$contentWrap.on("click", "a", function() { 

    $(this).addClass("btn-click"); 

    window.location.hash = $(this).attr("href"); 

    return false; 
}); 

$(window).on('hashchange', function() { 

    var  $aboutWrap = $("#a-wrap"), 
       $boxBtn = $("div.btn a"); 

    newHash = window.location.hash.substring(1); 


    if ($nav.hasClass("nav-click")){ 

    $contentWrap.load(newHash + " #content"); 
    $nav.removeClass("nav-click"); 
    }; 

    if ($boxBtn.hasClass("btn-click")){ 

     $aboutWrap.load(newHash + " #a-content"); 
     $boxBtn.removeClass("btn-click"); 
    }; 
}); 

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


}); /*/end*/ 

Answer 1

我也有類似問題，基本上在大多數情況下，問題是相互矛盾的元素的ID。在DOM中，您只能使用一次ID。您可以通過使用classNames和ID僅用於像包裝器這樣的唯一元素來解決這個問題。