Question

以下是我的ul li结构

<ul>
<li> <a href="#">Top Level </a>

    <ul>
        <li> <a href="#">Level 1_1</a>

            <ul>
                <li> <a title="" class="grower OPEN">Level 2_1</a>

                    <ul>
                        <li> <a title="" href="#">Level 3_1 </a><span>(1)</span>
                        </li>
                        <li> <a title="" href="#">Level 3_2 </a><span>(4)</span>
                        </li>
                    </ul>
                </li>
                <li>    <a href="#">Level 2_2 </a>

                    <ul>
                        <li>    <a href="#">Level 3_1 </a><span>(5)</span>
                        </li>
                        <li>    <a href="#">Level 3_2 </a><span>(1)</span>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
        <li> <a href="#">Level 1_2 </a>

            <ul>
                <li>    <a title="" href="#">Level 2_1 </a><span>(3)</span>
                </li>
            </ul>
        </li>
        <li>    <a title="" href="#">Level 1_3 </a><span>(2)</span>
        </li>
        <li>    <a title="" href="#">Level 1_4 </a><span>(1)</span>
        </li>
    </ul>
</li>

我计算的产品与较低级别的类别一起显示。我想要的是，使用jquery显示每个类别的父级的总计数。我不知道如何做到这一点。

当前系统：http://jsfiddle.net/jvfwhs3f/1/

必填项：http://jsfiddle.net/fz554136/

Answer 1

这是我所做的JSFiddle。

基本上我在所有跨度中添加了一个带有计数的类，并通过每个li循环以添加li中每个跨度的总和。但我建议您在跨度中使用数据属性（<span count="5">(5)</span>)包含总计数，以便您可以使用parseInt($(this).data('count'))直接解析数字

$(document).ready(function(){    
    $('ul li').each(function(){
        var $this = $(this);
        var totalSpan = $this.find('span.green');
        var total = 0;
        $this.find('span.total').each(function(){
            total += parseInt($(this).text().replace(/[^0-9]+/g, '')); 
        });
        totalSpan.html("(" + total + ")"); 
    });
});

使用ul中的Jquery获取总计数

1 个答案: