jquery – 如何检查一个项目是否有三个特定的类,如果是这样的话

尝试执行if语句,该语句检测列表项是否具有分配给它的类“约”’活动’和’项目’.我读过的每个帖子都是检查项目是否有三个类别中的一个.我想知道该项目何时具有所有三个类.
请任何帮助都会有所帮助,谢谢.

这就是我到目前为止所拥有的

var $activeItem =  $("#project05 ol.carousel-inner li.item");
    if ($activeItem.hasClass('about') & $activeItem.hasClass('active') & $activeItem.hasClass('item')) {
        alert("slide4 about is selected");
    }

这是HTML

<div id="project05" class="carousel slide">              
              <!-- Carousel items -->
              <ol class="carousel-inner">
                <li class="item home active">
                </li>
                <li class="item about">
                </li>
                <li class="item solutions">
                </li>
                <li class="item approach">
                </li>
              </ol>
              <!-- Carousel nav -->
              <ol class="carousel-linked-nav">
                <li class="active"><a href="#1">Home</a></li>
                <li><a href="#2">About</a></li>
                <li><a href="#3">Solutions</a></li>
                <li><a href="#4">Approach</a></li>
              </ol>
              <a class="carousel-control left" href="#project05" data-slide="prev">&lsaquo;</a>
              <a class="carousel-control right" href="#project05" data-slide="next">&rsaquo;</a>
            </div>

对于那些可能想要了解的人来说,这就是我所寻找的答案.

function carouselSlide() {
    $('#exterior-page .carousel').bind('slid',function() {
      $('#exterior-page.carousel-linked-nav .active').removeClass('active');
      var idx = $('#exterior-page .carousel .item.active').index();
      $('#exterior-page .carousel-linked-nav li:eq(' + idx + ')').addClass('active');
      if(idx === 0) {
          // alert("home page");
          $("#main-nav").removeClass();
          $("#main-nav").addClass('home-color');
        }
        else if(idx === 1) {
           // alert("about page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('about-color');
        }
        else if(idx === 2) {
           // alert("solutions page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('solutions-color');
        }
        else if(idx === 3) {
           // alert("approach page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('approach-color');
        }
    });
  }

解决方法

由于 Musa’s answer已经是我的upVote,但是这里有一点补充,因为它缺少这个案例：

如果类项目存在于多个< li> -element上,则您的选择器可以返回多个项目.在这种情况下：

if ($activeItem.is('.about.active')) {}

如果至少有一个元素具有特定的类,则它将始终返回true.如果多个条目可以包含类项,则可以在循环中检查结果,如下所示：

$.each($activeItem,function(key,value) {
    if ($(value).is('.active')) {
        alert ('Slide ' + key + ' is selected');
    }
});

要么

另一个想法是直接选择元素并获得如下索引：

var selected = $('ul li.active').index();

如果需要,可以在键或上面的语句中添加1,因为两个值都是从零开始的.

演示

Try before buy

编辑

看来,您正在使用Twitter BootStrap Carousel.如果是这种情况,您可以绑定slid事件,该事件在每次操作后触发(例如单击上一个/下一个按钮或使用导航).这应该做的伎俩：

$('.carousel').bind('slid',function() {
    var selected = $('ul li.active').index();
});​