Question

我正在尝试执行以下操作。当我点击＆lt; a＆gt;使用dropdown-toggle类标记我想看看按钮是否没有collasped类。如果不是，我将使用jquery

添加该类

<div class="user-controls">
    <button class="navbar-toggle navbar-btn collapsed">
        <span class="icon-reorder"></span>
    </button>
    <ul class="nav">
        <li class="hidden-xs"></li>
        <li class="hidden-xs"></li>
        <li class="user-profile">
            <a href="#" class="user-menu dropdown-toggle">Toggle</a>
        </li>
    </ul>
</div>

<script>
    $('a.dropdown-toggle').click(function(){
        var a = $('button.navbar-toggle').hasClass('.collapsed');
        alert(a);
    });
</script>

Answer 1

hasClass的参数中不包含.;参数只是一个类名，而不是一个选择器。所以：

$('a.dropdown-toggle').click(function(){
    var a = $('button.navbar-toggle').hasClass('collapsed');
    // No dot ----------------------------------^
    alert(a);
});

但请注意，addClass不会再次添加该类，因此如果您愿意，可以先调用它而不先检查。当然，如果您的其他逻辑取决于它是否具有该类，那么您需要使用hasClass。

一个。沃尔夫在对这个问题的评论中说：

我认为OP希望将相对button.navbar-toggle定位到点击的锚点

如果是，您可以使用closest前往容器，然后find查找容器中的按钮：

$('a.dropdown-toggle').click(function(){
    var a = $(this).closest('.user-controls').find('button.navbar-toggle').hasClass('collapsed');
    alert(a);
});

Answer 2

问题是你正在使用hasClass方法的选择器语法。即。您的代码有.hasClass('.collapsed');而不是.hasClass('collapsed');

Answer 3

以下代码检查元素是否具有“折叠”类。如果它没有该类，则添加它。

$('a.dropdown-toggle').on('click', function(){
  var e = $('button.navbar-toggle');
  if (e.hasClass('collapsed')) {
    alert('The element has the class!');
  }else{
    //This adds the collapsed class to it
    e.addClass('collapsed');
  }
});

Answer 4

  $('a.dropdown-toggle').click(function(){ if($('button.navbar-toggle').hasClass('collapsed'))
 {
      $('button.navbar-toggle').removeClass('collapsed');
 } 
 else{
      $('button.navbar-toggle').addClass('collapsed');} });



        Try this

使用jquery选择特定元素

4 个答案: