addClass（）在jQuery中的if子句中沒有按預期工作

我對jQuery非常陌生，我遇到以下問題。所以，我希望jQuery在用戶點擊li元素時進行偵聽，並且如果該元素已具有類active，它應該從該函數返回。如果一個元素沒有一個類active那麼它應該爲它添加一個類。所以，我想要的是當單擊元素時添加類，但當時只有一個元素可以具有類active。但是現在，我的代碼將active類添加到我單擊的每個元素。樓下是代碼：addClass（）在jQuery中的if子句中沒有按預期工作

<div class="container-fluid"> 
    <div class="col-sm-2"> 
     <ul class="nav nav-pills nav-stacked"> 
      <h3>Lists</h3> 
      <hr class="divider"> 
      <li><a href="#"><span class="glyphicon glyphicon-briefcase"></span> Work</a></li> 
      <li><a href="#"><span class="glyphicon glyphicon-plane"></span> Travel</a></li> 
      <li><a href="#"><span class="glyphicon glyphicon-book"></span> School</a></li> 
     </ul> 
    </div> 
</div> 

</div> 

<script> 
    (function() { 

     $('.nav').children('li').on('click', function() { 
      $this = $(this); 

      if ($this.hasClass('active')) { 
       return 0; 
      } else { 
       $this.addClass('active'); 
      } 

     }); 

    })(); 
</script>

來源

2014-09-02 Blaz Kranjcev

嘗試t = $（this）; t.hasClass（'active'）和t.addClass（'active'） – malkam 2014-09-02 17:52:00

爲什麼賦值給'$ this'而不是直接使用'$（this）'？ – xDaevax 2014-09-02 17:52:12

另外，你有沒有嘗試類似：'！（this）.hasClass（「active」）？ $（this）.addClass（「active」）：return 0;' – xDaevax 2014-09-02 17:53:47

試試這個

$(function(){ 
     $('.nav li').click(function() { 
      $('.nav li').removeClass("active");  
      $(this).addClass("active");  
     }); 
    });

來源

2014-09-02 17:51:14 kefy

嘗試像這樣 -

$('.nav').children('li').on('click', function() { 
    $('.nav').children('li').removeClass('active'); 
    $(this).addClass('active'); 

});

來源

2014-09-02 17:52:33

比如，你可以做somethink這樣的：

(function() { 
    $('.nav').on('click', 'li', function() { 
     $(this).toggleClass('active') 
      .siblings('li').removeClass('active'); 
    }); 

})();

this裏面的事件處理程序參考只對事件被觸發的DOM元素（對於在我們的例子中被點擊的li）。如果您登錄this回調函數裏面，你會看到，它只是指一個li元素（這是點擊）：

(function() { 
     $('.nav').children('li').on('click', function() { 
      console.log(this); //logs <li class="active"> </li> 
      //other code 
    })();

來源

2014-09-02 17:57:15 Elena

偉大的單線！ – FrEaKmAn 2014-09-02 17:59:39

基本上我們添加類，並從所有的兄弟姐妹刪除類。

(function() 
{ 
    $('.nav').on('click', 'li', function() 
    { 
     $(this).addClass('active') 
       .siblings('li') 
       .removeClass('active'); 
    }); 
})();

來源

2014-09-02 17:58:11 FrEaKmAn

addClass（）在jQuery中的if子句中沒有按預期工作

回答

相關問題