Question

这是我想要实现的目标。

我已经使用JQuery在每个>旁边添加<li>个元素，并使用嵌套的<ul>来表明它具有嵌套菜单。

我试图将href从<li>中用嵌套<ul>归来，并创建（作为嵌套菜单中的第一项）Overview 1}}菜单项。

例如：

• Phones
    - Overview
    - Phone Types
    - Phone FAQs

使用Phones父级的概述链接创建菜单，并动态创建Overview链接。

这是我目前所拥有的：

$('li.menu-item').each(function(index){
        if($(this).children('ul').length>0){
            var theHref = $(this).children('a').attr('href');
            var ulContent = $(this).children('ul').html();
            $(this).children('a').attr('href', '#');
            $(this).children('ul').html('<li><a href="'+theHref+'">Overview</a></li>'+ulContent);
            $(this).append('<div class="menu-ticker"><a class="ticker">></a></div>');
        }
    });

menu-ticker指的是>元素。

我的错误是（使用上面的示例）电话类型也有嵌套菜单。但是，一旦我添加了Overview链接，>就不会出现在子子菜单上。没有Overview代码，它可以正常工作。

有人可以帮忙吗？

更新
根据要求，这里是一个JSFiddle - http://jsfiddle.net/wGKQh/

Answer 1

好吧，解决方案正盯着我看，因为我把html撕成了一个变量然后重新添加了一个变量，选择器没有针对我修改过的那些。

而不是这个，我使用了prepend。

$('li.menu-item').each(function(index){
        if($(this).children('ul').length>0){
            var theHref = $(this).children('a').attr('href');
            $(this).children('a').attr('href', '#');
            $(this).children('ul').prepend('<li><a href="'+theHref+'">Overview</a></li>');
            $(this).append('<div class="menu-ticker"><a class="ticker">></a></div>');
        }
    });

JQuery修改嵌套的无序列表

1 个答案: