首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >动态多级each() jQuery

问动态多级each() jQuery
EN

Stack Overflow用户
提问于 2013-04-27 23:08:03
回答 2查看 885关注 0票数 0

我在使用jQuery创建多级each()时遇到了问题。这是我的代码,但这被限制在3个级别。我想让它在无限级别下工作。

这是一个JsFiddle演示链接:http://jsfiddle.net/cWJH5/1/

HTML

代码语言:javascript
复制
<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

代码语言:javascript
复制
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++;
        });
    });
});
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-04-27 23:17:50

我认为你需要像下面这样的递归函数。演示:http://jsfiddle.net/x5WDc/

代码语言:javascript
复制
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
EN

Stack Overflow用户

发布于 2013-04-27 23:19:04

也许就是这样:

SEE DEMO

代码语言:javascript
复制
$('#menu ul').each(function () {
    var Startlevel = $(this).parents('#menu ul').length;
    $(this).addClass('item-' + $('#menu ul.level-' + Startlevel).length + ' level-' + Startlevel);

});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16253657

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档