Skip to content

Latest commit

 

History

History
209 lines (202 loc) · 9.96 KB

4.3.2 多级菜单遍历判断子节点.md

File metadata and controls

209 lines (202 loc) · 9.96 KB

demo

var nature = [
                    {
                        name: "华东区",
                        check: false,
                        children: [
                            {
                                name: "华东1区",
                                check: false,
                                children: [
                                    {
                                        name: "华东11区",
                                        check: false,
                                        children: [
                                            {
                                                name: "华东111区",
                                                check: false,
                                                children: [
                                                    {
                                                        name: "华东1111区",
                                                        check: false,
                                                    },
                                                    {
                                                        name: "华东1112区",
                                                        check: false,
                                                    },
                                                ]
                                            },
                                            {
                                                name: "华东112区",
                                                check: false,
                                            },
                                        ]
                                    },
                                    {
                                        name: "华东12区",
                                        check: false,
                                        children: [
                                            {
                                                name: "华东121区",
                                                check: false,
                                            },
                                            {
                                                name: "华东122区",
                                                check: false,
                                            },
                                        ]
                                    },
                                ]
                            },
                            {
                                name: "华东2区",
                                check: false,
                                children: [
                                    {
                                        name: "华东21区",
                                        check: false,
                                    },
                                    {
                                        name: "华东22区",
                                        check: false,
                                    },
                                ]
                            },
                            {
                                name: "华东3区",
                                check: false,
                                children: [
                                    {
                                        name: "华东31区",
                                        check: false,
                                    },
                                    {
                                        name: "华东32区",
                                        check: false,
                                    },
                                ]
                            },
                            {
                                name: "华东4区",
                                check: false,
                                children: [
                                    {
                                        name: "华东41区",
                                        check: false,
                                    },
                                    {
                                        name: "华东42区",
                                        check: false,
                                    },
                                ]
                            }
                        ]
                    },
                    {
                        name: "华西区",
                        check: false,
                        children: [
                            {
                                name: "华西1区",
                                check: false,
                            },
                            {
                                name: "华西2区",
                                check: false,
                            }
                        ]
                    },
                    {
                        name: "华南区",
                        check: false,
                        children: [
                            {
                                name: "华南1区",
                                check: false,
                            },
                            {
                                name: "华南2区",
                                check: false,
                            }
                        ]
                    },
                    {
                        name: "华北区",
                        check: true,
                        children: [
                            {
                                name: "华北1区",
                                check: true,
                            },
                            {
                                name: "华北2区",
                                check: true,
                            }
                        ]
                    },
                    {
                        name: "华中区",
                        check: false,
                        children: [
                            {
                                name: "华中1区",
                                check: true,
                            },
                            {
                                name: "华中2区",
                                check: false,
                            }
                        ]
                    },
                    {
                        name: "华区",
                        check: true
                    }
                ];
                
                append()//追加数据
                function append() {
                    var checklist = [];
                    nature.forEach(function(el,index) {
                        var show = '';
                        var label = '';
                        if (el.check == true) {
                            show = 'checked="checked"';
                            checklist.push(true)
                        }else {
                            show = '';
                        }
                        if (el.children) {// 判断是否有孩子节点
                          label = '<div class="area-cell list-cell'+index+' label-list'+index+'"><label class="area-cell-label weui_cell weui_check_label weui_cells_access s'+index+'" for="s'+index+'"><div class="weui_cell_hd"><input type="checkbox" class="weui_check" name="checkbox1" id="s'+index+'"'+show+'><i class="weui_icon_checked"></i></div><div class="weui_cell_bd weui_cell_primary"><p>'+el.name+'</p></div><div class="weui_cell_ft" data-role="0"></div></label></div>';
                          $('.nature-list').append(label)//第一层数据
                        
                          children(el,''+index)//检查子节点
                        }else {
                          label = '<div class="area-cell list-cell'+index+'"><label class="area-cell-label weui_cell weui_check_label weui_cells_access s'+index+'" for="s'+index+'"><div class="weui_cell_hd"><input type="checkbox" class="weui_check" name="checkbox1" id="s'+index+'"'+show+'><i class="weui_icon_checked"></i></div><div class="weui_cell_bd weui_cell_primary"><p>'+el.name+'</p></div></label></div>';
                          $('.nature-list').append(label)//第一层数据
                        }
                    })
                    checknum()//检查选择数量
                }

                function children(item,index) {
                  if (item.children) {
                    item.children.forEach(function(e1,k1){
                      var showchild = '';
                      var labelchild = ''; //要插入的标签
                      if (e1.check == true) {
                          showchild = 'checked="checked"';
                      }else {
                          showchild = '';
                      }
                      if (e1.children) {
                        labelchild = '<div class="label-list label-list'+index+k1+'"><label class="weui_cell weui_check_label weui_cells_access" for="s'+index+k1+'"><div class="weui_cell_hd"><input type="checkbox" class="weui_check" name="checkbox1" id="s'+index+k1+'"'+showchild+'><i class="weui_icon_checked"></i></div><div class="weui_cell_bd weui_cell_primary"><p>'+e1.name+'</p></div><div class="weui_cell_ft" data-role="0"></div></label></div>';

                        $('.label-list'+index).append(labelchild); // 第二层数据列表
                        children(e1,''+index+k1); // 检查子节点
                      }else {
                        labelchild = '<div class="label-list label-list'+index+k1+'"><label class="weui_cell weui_check_label weui_cells_access" for="s'+index+k1+'"><div class="weui_cell_hd"><input type="checkbox" class="weui_check" name="checkbox1" id="s'+index+k1+'"'+showchild+'><i class="weui_icon_checked"></i></div><div class="weui_cell_bd weui_cell_primary"><p>'+e1.name+'</p></div></label></div>';

                        $('.label-list'+index).append(labelchild); // 第二层数据列表
                      }
                    })
                  }else {

                  }
                }