需要在另一个 div 悬停时将类添加到 div

Question

我有一个div同班的名单。每个 div 包含其他 div、.header、.body、.footer。例如，当我将鼠标悬停在一个 div 内的一个元素上时.header，我需要.footer在同一 div 内的另一个元素上添加/删除一个类。问题是当我悬停一个时.header- 我正在向.footer所有其他 div 内的所有元素添加类，但我只需要向.footer当前 div 内添加新类。$(document).ready(function() {  $('.header').hover(function() {    $('.footer').addClass('active');  }, function() {    $('.footer').removeClass('active');  });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="list">  <div class="list_item">    <div class="header"></div>    <div class="body"></div>    <div class="footer"></div>  </div>  <div class="list_item">    <div class="header"></div>    <div class="body"></div>    <div class="footer"></div>  </div>  <div class="list_item">    <div class="header"></div>    <div class="body"></div>    <div class="footer"></div>  </div></div>

Answer 1

是的可以尝试下面的代码片段，我已经测试过了。

$(document).ready(function() {     

    $('.header').hover(function(){     

        $(this).siblings(".footer").addClass('active');    

    },     

    function(){    

        $(this).siblings(".footer").removeClass('active');      

    });

});