Question

我的页面上有多个div，里面有多个li

<div>
<li></li>
<li></li>
<li></li>
</div>


<div>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</div>

我想要的是当任何人徘徊在任何一个li上时它会触发悬停在那个以及之前所有特定div的li上，或者至少在其上添加任何一个类并且当悬停时从所有li中删除类

Answer 1

您可以使用 prevAll() 选择所有之前的li和 hover() 来处理悬停事件

注意：您的HTML无效。元素li不允许作为元素div的子元素，li应该是ul或ol的子元素

＆＃13;

$('div li').hover(function() {
  $(this).addClass('hover').prevAll('li').addClass('hover');
}, function() {
  $(this).removeClass('hover').prevAll('li').removeClass('hover');
})

＆＃13;

.hover {
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>
</div>


<div>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
  </ul>
</div>

＆＃13;

Answer 2

是<li></li>允许作为<div></div>的孩子吗？据我所知，我们不能这样做......他们必须是<ol></ol>或<ul></ul> ...

的孩子

你可以检查一下然后尝试使用prevAll（）

问候！

将鼠标悬停在同一个父母的所有上一个li上时将其悬停

2 个答案: