javascript - 兄弟 div 上的 removeClass 不起作用

Question

这是 HTML 的结构：

<div class="agShowBox">
     <div class="agEmpty"> </div>
     <div class="agShowImgBox">
           <div class="centerImg">
           <div class="centerImg">
           <div class="centerImg">
           <div class="centerImg">
           <div class="centerImg">
           <div class="centerImg hideThis">
           <div class="clearit"></div>
     </div>
     <div class="agRightArrow">
          <img alt="next" src="images/arrow_right.png">
     </div>
     <div class="clearit"></div>
</div>

这是我的 jQuery 代码：

$("#agMidBox").on('click', '.agRightArrow', function() {
    $(this).siblings(".agShowImgBox").children(".centerImg:lt(6)").addClass("hideThis");
    $(this).siblings(".agShowImgBox").children(".centerImg:gt(5)").removeClass("hideThis");                 
});

问题是我无法hideThis从类中的第 6 个div 中删除该类agShowImgBox。

这段代码应该这样做，对吧

$(this).siblings(".agShowImgBox")
       .children(".centerImg:gt(5)")
       .removeClass("hideThis");

添加类正在工作。但不删除类。

Answer 1

:gt()是从零开始的。:gt(5)将匹配第六个元素之后的元素，但不会匹配第六个元素本身。

你应该写：

$(this).siblings(".agShowImgBox")
       .children(".centerImg:gt(4)")
       .removeClass("hideThis");