javascript - 删除列表项目会重新计算邮件计数

Question

我有一个邮箱菜单，您可以右键单击该菜单并选择删除一个文件夹，如下所示:

<ul>
    <li>
        Level 1
        <span class="badge badge-success MailCount">60</span>
        <ul>
            <li>
                Level 2 a
                <span class="badge badge-success MailCount">10</span>
                <ul>
                    <li>
                        Level 2 a i
                        <span class="badge badge-success MailCount">10</span>
                    </li>
                    <li>
                        Level 2 b ii
                        <span class="badge badge-success MailCount">10</span>
                    </li>
                    <li>
                        Level 2 c iii
                        <span class="badge badge-success MailCount">10</span>
                    </li>
                </ul>
            </li>
            <li>
                Level 2 b
                <span class="badge badge-success MailCount">10</span>
            </li>
            <li>
                Level 2 c
                <span class="badge badge-success MailCount">10</span>
            </li>
        </ul>
    </li>
</ul>

我的 Javascript 文件如下所示；

$(document).ready(function() {
    "use strict";

    $(document).on('click', function(e) {

        var action = $(e.target).data('action'),
            anchor = '',
            clicked = $('.clicked'); // This is applied when you right-click teh item

        switch (action) {
            // Rename a mail sub-folder...
            case 'rename-folder':

                break;
        }

    });
});

所以在这个时候，我要做的就是 clicked.remove(); 但现在我想获取 .clicked > .MailCount 值并将其从上面的所有 .MailCount 中删除，如果 .clicked 具有也将被删除的直接 ul，则应添加它们的值增加当前值并从上述值中删除。

我希望我没有让这听起来比实际情况更复杂。基本上，如果您删除 Level 2 a，它将添加 Level 2 a + Level 2 a i + Level 2 a ii + 2 级 a iii 并将它们从 1 级

带走

Answer 1

使用.map()循环遍历要删除的li中的所有.MailCount元素，并将其所有内容相加。然后从最上面的 .MailCount 中的总数中减去它。

var remove_total = 0;
clicked.find(".MailCount").map(function() {
    remove_total += parseInt($(this).text(), 10);
});
clicked.parents("li").last().find(".MailCount").first().text(function(i, oldText) {
    return parseInt(oldText, 10) - remove_total;
});
clicked.remove();