javascript - 向父元素和子元素添加 "active"类

Question

如果用户单击列表中的子元素，则需要向父元素和子元素添加事件类。我的 html 如下:-

<ul class="tabs">
      <li class="accordion"><a href="#tab1">Bar</a>
         <ul class="sub">
           <li>lorem/li>
           <li>ipsum</li>
           <li>Lorem Ipsum</li>
           <li>Dolor Sit Amet</li>
         </ul>
      </li> 

我正在使用下面的 jquery 代码向父元素和子元素添加事件类，但出现错误:-

$("ul.tabs li").click(function() {
      $("ul.tabs li").removeClass("active").find(".sub li").removeClass("active"); 
      $(this).addClass("active").find(".sub li").addClass("active"); 
});

然后在 CSS 中设置我的事件类的样式。说个例子

.active {background:#EFEFEF;}

只有单击的(this)子元素才应应用事件类，而不是整个 li 子元素。现在，与子 li(例如 lorem)一起，父 li(bar)也应该突出显示。将其想象为一个树形 Accordion 菜单，其中选定的子元素及其父元素 li 都具有具有不同 css 样式的事件类。

Answer 1

我只是在这里假设您只想将事件类添加到列表项中，如下所示:http://jsfiddle.net/gfkM4/

我希望这就是您所寻找的。干杯。