jquery - 如何检查一个元素是否具有三个特定类，如果是，则执行此操作

Question

尝试执行一个 if 语句来检测列表项是否分配有类“about”、“active”和“item”。我读过的每一篇文章都是为了检查该元素是否具有三个类别之一。我想知道该元素何时具有所有三个类别。 请提供任何帮助，谢谢。

这是我目前的情况

     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');
        }
    });
  }

Answer 1

尝试

if ($activeItem.is('.about.active')) {
    alert("slide4 about is selected");
}

我没有包含 item，因为它在选择器中用于选择 $activeItem，因此如果选择了一个元素，它将已经具有该类。如果稍后您想要测试 3 个类，而元素的类可能会更改，请使用 if ($activeItem.is('.about.active.item')){

注意 is 将返回 true 如果任何 li 有类，如果你想在个人基础上测试然后

$activeItem.each(function(){
    if ($(this).is('.about.active')) {
        alert("slide4 about is selected");
    }
});