我在使用jQuery创建多级()时遇到问题。这是我的代码,但这仅限于3个级别。我想让它与无限级别一起工作。
这是一个JsFiddle演示链接:http://jsfiddle.net/cWJH5/1/
<nav id="navMenu">
<ul>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
<ul>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
<ul>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
<ul>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
</li>
<li><a href="#">DEMO</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
Startlevel = 0;
$('#menu > ul').each(function (i) {
$(this).addClass('item-' + i + ' level-' + Startlevel );
menuLevel++;
$(this).find('> li > ul').each(function (i) {
$(this).addClass('item-' + i + ' level-' + Startlevel );
menuLevel++;
$(this).find('> li > ul').each(function (i) {
$(this).addClass('item-' + i + ' level-' + Startlevel );
menuLevel++;
});
});
});
答案 0 :(得分:1)
我认为你需要像下面这样的递归函数。演示:http://jsfiddle.net/x5WDc/
var level = 0;
var assign_classes = function (list) {
list.each(function (i) {
$(this).addClass('item-' + i + ' level-' + level);
level++;
assign_classes($(this).find('> li > ul'));
level--;
});
};
assign_classes($('#menu > ul'));
答案 1 :(得分:1)
也许只是这个:
$('#menu ul').each(function () {
var Startlevel = $(this).parents('#menu ul').length;
$(this).addClass('item-' + $('#menu ul.level-' + Startlevel).length + ' level-' + Startlevel);
});