jquery - 如果只有第一个和最后一个具有特定班级的孩子，如何向父母添加班级

Question

有人可以帮忙解决我的 jQuery 问题吗？

我的代码中有 Bootstrap 滑块。

每次我单击 Next/Prev 箭头时，相应的 div 都会“选中”类。

现在我想在只有第一个和最后一个 div 具有“选定”类的情况下向父级添加类</p>

<div id="myCarousel" class="carousel slide" data-ride="carousel">

<div class="carousel-inner">
  <div class="carousel-item active">
    <div class="row">                                      
    <div id="carousel-selector-0" class="thumb selected" data-target="#myCarousel" data-slide-to="0"></div>                                             
    <div id="carousel-selector-1" class="thumb " data-target="#myCarousel" data-slide-to="1"></div>
    <div id="carousel-selector-2" class="thumb " data-target="#myCarousel" data-slide-to="2"></div>
    <div id="carousel-selector-3" class="thumb " data-target="#myCarousel" data-slide-to="3"></div>
    <div id="carousel-selector-4" class="thumb " data-target="#myCarousel" data-slide-to="4"></div>
   </div>
 </div>
</div>

<a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev"></a>
<a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next"></a>
   
</div>

---

if ($(".thumb").first().hasClass("selected")) {
     $(".carousel").addClass("new-class");
   } else {
     $(".carousel").removeClass("new-class");
}

if ($(".thumb").last().hasClass("selected")) {
     $(".carousel").addClass("new-class");
   } else {
     $(".carousel").removeClass("new-class");
}

提前致谢！

标签： jquerybootstrap-4

Answer 1

只需将这些附加到按钮上，如

$('[data-slide="prev"], [data-slide="back"]').click(function() {
      if ($(".thumb").first().hasClass("selected")) {
        $(".carousel").addClass("new-class");
      } else {
        $(".carousel").removeClass("new-class");
      }

      if ($(".thumb").last().hasClass("selected")) {
        $(".carousel").addClass("new-class");
      } else {
        $(".carousel").removeClass("new-class");
      }
    }