2

我正在尝试执行以下操作。当我单击带有下拉切换类的 < a > 标记时,我想查看按钮是否没有折叠类。如果不是,我将使用 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>
4

4 回答 4

3

您没有.在 ; 的参数中包含hasClass; 参数只是一个类名,而不是选择器。所以:

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

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


A. Wolff 在对该问题的评论中说:

我认为 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);
});
于 2013-09-25T08:32:08.580 回答
1

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

于 2013-09-25T08:33:51.977 回答
0
  $('a.dropdown-toggle').click(function(){ if($('button.navbar-toggle').hasClass('collapsed'))
 {
      $('button.navbar-toggle').removeClass('collapsed');
 } 
 else{
      $('button.navbar-toggle').addClass('collapsed');} });



        Try this
于 2013-09-25T08:40:21.400 回答
0

以下代码检查元素是否具有“折叠”类。如果它没有那个类,它会添加它。

$('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');
  }
});
于 2013-09-25T08:34:26.073 回答