Javascript 将鼠标悬停在ol上，影响同一页面上具有多个版本的另一个特定元素

我已经玩了一段时间了，但就是想不出来

但老实说，我对javascript还相当陌生，所以这可能是一个显而易见的问题

我有一个旁白，上面有一个ol，你可以在上面悬停并影响页面上的相关图像。 这很好，但我想有这个组件的多个版本。一个用于活动，另一个用于文章等

如果我将鼠标悬停在一个组件上，它会影响另一个组件

提前谢谢你的帮助

请看我的密码笔

HTML

请看我的密码笔

---

有很多不同的方法可以做到这一点，但根据您的布局，您可以特别选择所需的

。列表2

，而不是两者。添加当前悬停的元素很简单

---

请检查此代码笔，如果它解决了您的疑问

找到父级

div

，然后找到要突出显示的

ul>li

子级

$('ol li').hover(function() {
      var index = $(this).index();
      $(this).parents("div").find("ul li").eq(index).toggleClass("active");     
});

---

谢谢这个@exploionpills，我知道我已经很接近了，但就是没能做最后一小步。从未见过。索引

$('.list1 li').each(function(){
        $(this).hover(function() {
          var index = $(this).index();
          $(".list1, .list2").each(function() {
            $("li", this).eq(index).toggleClass("active");
          });
        });
    });

var index = $(this).index();
$(this).closest(".aside").next().find("li")
    .eq(index).add(this).toggleClass("active");

$('ol li').hover(function() {
      var index = $(this).index();
      $(this).parents("div").find("ul li").eq(index).toggleClass("active");     
});