Jquery addclass on hover

Jquery addclass on hover

本文关键字：hover on addclass Jquery      更新时间：2023-09-26

我有这样的结构

<div class="container">
  <a> <img /> </a>
  <div id="actions"></div>
 <ul id="add-to"> </ul>
</div>

我使用的脚本是这样的

<script>
jQuery(function() {
    jQuery("#actions, #add-to").hover(function(){
        jQuery(this).prev('a').addClass('opacity');
    }, function() {
        jQuery(this).prev('a').removeClass('opacity');
    });
});
</script>

当鼠标悬停在actions元素id上时，它可以工作，但不能与#add-to。

你能帮我一下吗?由于

prev() 只选择紧接前一个元素，a不紧接在#add-to之前。在这种情况下，您可以使用 siblings() 或 prevAll() 。当使用 prevAll() 时，使用 first() 来接近

<script>
jQuery(function() {
    jQuery("#actions, #add-to").hover(function(){
        jQuery(this).siblings('a').addClass('opacity');
    }, function() {
        jQuery(this).siblings('a').removeClass('opacity');
    });
});
</script>

或

<script>
jQuery(function() {
    jQuery("#actions, #add-to").hover(function(){
        jQuery(this).prevAll('a').first().addClass('opacity');
    }, function() {
        jQuery(this).prevAll('a').first().removeClass('opacity');
    });
});
</script>
相关文章：