我在使用 jQuery 创建多级each() 时遇到问题。这是我的代码,但仅限于 3 个级别。我想让它在无限级别上工作。
这里是 JsFiddle 演示链接:http://jsfiddle.net/cWJH5/1/
HTML
<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>
JS
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++;
});
});
});
最佳答案
我认为你需要像下面这样的递归函数。演示: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'));
关于javascript - 动态多级each() jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16253657/