Javascript/Jquery树Travesal问题

假设我有以下几点

<ul>
<li>Item 1</li>
<li>Item 2
   <ul>
    <li>Sub Item</li>
   </ul>
</li>
<li>Item 3</li>
</ul>

项目1
项目2

分项


项目3

此列表是由其他代码自动生成的（因此添加排他id/类是不可能的。假设我有一些jquery代码，说明如果我将鼠标移到一个li上，它会得到一个背景色。但是，如果我将鼠标移到“子项”列表项上，“项2”也会高亮显示。我如何使它能够在用户鼠标移到上方时显示“子项”仅在其上添加背景色，而不在“项2”上添加背景色

我还忘了提到我已经有了$（“li”）之类的东西。页面上的doSomething…已经…

尝试$（'ul li'）作为您的选择器。即

ul li li:hover {background:#00F;}

编辑

对于JQuery解决方案，它是相同的选择器

ul li li:hover {background:#00F;}

---

`$（'ul li'）.css（'background'，'#00F'）；

首先，在

元素上需要一点css、一个悬停类和一个背景，这样子元素上就不会显示父元素的背景（否则，它们会有一个透明的背景，所以无论父元素有什么，都会显示出来），如下所示：

​.hover { background: #ddd; }
li { background: #fff; }

$('li').mouseover(function(e){
    $(this).addClass("hover").parents().removeClass("hover");
    e.stopPropagation();
}).mouseout(function(){
    $(this).removeClass("hover");
});​

然后您可以使用

mouseover

和

mouseout

（而不是

mouseenter

和

mouseleave

类似的用法），如下所示：

​.hover { background: #ddd; }
li { background: #fff; }

$('li').mouseover(function(e){
    $(this).addClass("hover").parents().removeClass("hover");
    e.stopPropagation();
}).mouseout(function(){
    $(this).removeClass("hover");
});​

。它使用and（因此在输入/离开子元素时激发，而子元素

mouseenter

/

mouseleave

特别不会）。在悬停时，我们将

悬停

类应用于当前的

，并将该类从任何可能拥有该类的父级中删除。此外，我们还防止事件冒泡，因此相同的事情不会发生在该元素的父级上……只需在演示中对此进行注释，以查看其影响：）

---

​

+1-我的问题完全错了。这里有一个用于演示的代码purposes@Ben-谢谢，不过我在问题中链接了一把小提琴：）我通常会在演示时尝试：）