javascript - 用递归方式怎么实现多层父子关系的元素进行删除?

问题描述

问 题

功能代码：
点击删除按钮触发事件：
备注：$(".btn_del")是删除按钮
需求：只要删除当前的行是有子集的数据，那么就一并删除子集的数据。
现在的关联关系的就是父级有id，子集有pid，一个或多个层级都是对应的。
用循环写不知道感觉太麻烦了，不知道用递归是否可以解决这类问题，理解意思的朋友能不能说说你们的思路？
这段代码应该怎么修改？

// 删除单项或父子级关系的数据
$(".btn_del").click(function() {
    var single_row = $(this).closest('tr');
    console.info($(this).closest('tbody').find('tr'));
    var arr_tr = $(this).closest('tbody').find('tr');
    var cur_trId = $(this).closest('tr').attr('id');
    console.log(cur_trId);
    // var data = single_row.attr('data');
    // console.info(JSON.parse(data));
    var cv = single_row.attr('hv');
    var tr_id = single_row.attr('id');
    var tr_pid = single_row.attr('pid');
    console.log(cv);
    if (cv == 1) {
        var stit = '审核';
        var scont = '该分类包含的自己分类也会被全部删除 您确定要删除该和子级分类吗？';
        layer.confirm(scont, {
            icon: 0,
            title: stit,
            shade: false
        }, function(index) {
            //todo 删除id和pid关联的数据方法
            //先发请求调用接口再做删除
            //用递归解决多层级删除
            arr_tr.each(function() {
                // console.log($(this).attr('id'));
                // console.log($(this).attr('pid'));
                var cid = $(this).attr('id');
                var Pid = $(this).attr('pid');
                console.log(Pid);
                if (cur_trId == Pid) {
                    // $(this).remove();
                    // console.info($(this));
                    console.log("ffffff");
                }
            });
            layer.msg('已删除!', {
                icon: 1,
                time: 1000
            });
        });
    } else {
        layer.confirm('确认要删除吗？', {
            icon: 0,
            title: '警告',
            shade: false
        }, function(index) {
            //todo 删除id和pid关联的数据方法
            //先发请求调用接口再做删除
            single_row.remove();
            layer.msg('已删除!', {
                icon: 1,
                time: 1000
            });
        });
    }

});

解决方案

用通配符写选择器呗
比方说你要删除 TR_0
先删除 $('tr[id^=TR_0_]').remove();
再删除 $('tr[id=TR_0]').remove();

这篇关于javascript - 用递归方式怎么实现多层父子关系的元素进行删除?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！