2016-10-25 75 views
-1

如果.navigation.primary有一個.active類的類,但它似乎不工作,那麼下面的腳本應該爲.global-header添加一個類(.active)?hasClass + addClass無法運行

JS

if($(".navigation.primary").hasClass("active")) { 
    $('.global-header').addClass('active'); 
} 

HTML

<header class="global-header"> 
    <div class="site-navigation"> 
     <div class="left-menu"></div> 
     <div class="right-menu"></div> 
    </div> 
</header> 

<nav class="navigation primary">Menu</nav> 
+1

您可以顯示html代碼? – PSR

+0

你能提供你的DOM片段嗎? –

+0

它以什麼方式不「*似乎在工作?」什麼是錯誤的,什麼沒有發生,發生了什麼不應該發生,什麼錯誤消息在瀏覽器中被報告?你怎麼指望我們在不知道問題是什麼或者你期望發生什麼的情況下解決這個問題? –

回答

1

基礎上的評論,當加載頁面時,如果與navigation.primary元素沒有active類,但後來,當一個動作發生將得到active那麼你需要在你的代碼中添加事件監聽器來觸發該類的添加。

如果navigation.primaryactive當頁面加載後,你需要添加文件準備:

$(function() { //when document is ready 
    if($(".navigation.primary").hasClass("active")) { 
     $('.global-header').addClass('active'); 
    } 
}); 

,或者一個事件發生,例如滾動窗口:

$(function() { //when document is ready 
    $(window).on('scroll', function() { //When scrolling 
     if($(".navigation.primary").hasClass("active")) { 
      $('.global-header').addClass('active'); 
     } 
    }); 
}); 
0

.navigation.primary沒有一個主動類。通常,$(".navigation.primary").hasClass("active")將評估爲false。

<nav class="navigation primary">Menu</nav> 

這應該是:

<nav class="navigation primary active">Menu</nav>