jQuery - 在动态创建的菜单中更改菜单项的路径的CSS

Question

我正在使用该jQuery垂直菜单库www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.htm我想完成所选路径的选择。比方说，我去通过菜单（在演示在该网站上）由路径：

Folder 2 > Folder 2.1 > Folder 3.1.1 > SubItem 3.1.1.1 

当我点击SubItem 3.1.1.1我想的是，所有以前的项目（从上面的路径）改变了他们的背景。下面的代码只选择最上面的项目。如何解决这个问题？

$('#nav > li').click(function() { 
     $(this).children('a').css('background-color', 'red'); 
     $(this).parents('ul').each(function() { $(this).prev('a').css('background-color', 'red'); }); 
    }); 

。在这种情况下，我的代码失败了。

Answer 1

菜单似乎是有组织的方式，单击事件会冒泡从孩子li于母公司li，所以你只需要点击事件绑定到所有菜单项，并设定背景为当前元素：

$('#nav li').click(function() { 
    $(this).children('a').css('background-color', 'red'); 
}); 

你仍然可能想取消设置红色背景，当您点击另一个菜单项

Answer 2

解决尝试＃1：

$('#nav a').click(function() { 
     $(this).css('background-color', 'red'); 
     $('a.selected').css('background-color', 'red'); 
    });