使用 jquery 在 link 项目中添加插入符号

Question

我正在尝试在 link 项后插入插入符号，即 列表 A、列表 B、列表 C、列表 D。如果列表（<li class="level0">）中有不止一项。

看下面我的HTML

<nav class="navigation" data-action="navigation">
<ul class="ui-id-2">
<li class="level0"><a href="#">List A</a></li>
<li class="level0"><a href="#">List B</a></li>
<li class="level0"><a href="#">List C</a>
    <ul class="ui-id-3">
            <li class="level0"><a href="#">in A</a></li>
            <li class="level0"><a href="#">in B</a></li>
            <li class="level0"><a href="#">in C</a></li>
        </ul>
</li>
<li class="level0"><a href="#">List D</a></li>

</ul>

</nav>

这是我尝试过但没有成功的方法

    $(document).ready(function(){


 $('.navigation .level0 > a').each(function() {
        if($(this).parent('li').children('a').size() > 1 ) {
           $(this).append('<span class="dwn">▼</span>');
        }           
    });

});

这是一个愚蠢的问题，但我们将不胜感激。谢谢

Answer 1

试试这个，我也放了n级的例子。

$('.navigation .level0 a').each(function() {
  var hasElements = $(this).closest('.level0').find('li').length>0;
        if(hasElements) {
           $(this).append('<span class="dwn">▼</span>');
        }           
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav class="navigation" data-action="navigation">
<ul class="ui-id-2">
<li class="level0"><a href="#">List A</a></li>
<li class="level0"><a href="#">List B</a></li>
<li class="level0"><a href="#">List C</a>
    <ul class="ui-id-3">
            <li class="level0"><a href="#">in A</a>
            <ul class="ui-id-3">
            <li class="level0"><a href="#">in A</a></li>
            <li class="level0"><a href="#">in B</a></li>
            <li class="level0"><a href="#">in C</a></li>
        </ul></li>
            <li class="level0"><a href="#">in B</a></li>
            <li class="level0"><a href="#">in C</a></li>
        </ul>
</li>
<li class="level0"><a href="#">List D</a></li>

</ul>

</nav>

更新您的代码中唯一需要更改的就是这样做

$(this).closest('.level0').find('li').length

当你定位一个锚点时，你需要找到它最近的 li 元素。由于此 HTML 结构将具有嵌套形式的列表元素。

对于嵌套，我的意思是您可以下拉到 n 级层次结构（列表 (li) 到列表 (li)）。

所以我们检查了当前锚点最近的 li 项目是否有子元素作为 li 并检查它们的长度是否大于 0。

使用 jquery 在 link 项目中添加插入符号

Adding caret inside a link item using jquery

jquery

list

nav