我在页面上有多个 div,里面有多个 li
<div>
<li></li>
<li></li>
<li></li>
</div>
<div>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</div>
我想要的是,当任何人悬停在任何 li 上时,它会触发悬停在该 li 上以及特定 div 的所有先前 li 上,或者至少在其上添加任何类,当悬停时从所有 li 中删除类
最佳答案
您可以使用 prevAll()
选择所有以前的 li
,和 hover()
用于处理悬停事件
注意:您的 html 无效。元素 li 不允许作为元素 div
的子元素,li
应该是 ul
或 ol
的子元素
$('div li').hover(function() {
$(this).addClass('hover').prevAll('li').addClass('hover');
}, function() {
$(this).removeClass('hover').prevAll('li').removeClass('hover');
})
.hover {
color: red;
}
<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>
关于javascript - 将鼠标悬停在一个上时,将同一父级的所有先前 li 悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32775683/