toTree:function(treeDatas) { var that = this; var rs = []; for(var i=0; i<treeDatas.length; i++) { var pid = -1; if(treeDatas[i].hasOwnProperty("pid")){ pid = treeDatas[i].pid; } rs.push({id: treeDatas[i].id, name: treeDatas[i].subjectName, pid: pid, code: treeDatas[i].subjectNo}); } //获取容器对象 var selectbox = document.getElementById("selectbox"); var tree = that.listToTree(rs,-1);//调用函数,传入要转换的list数组,和树中顶级元素的pid //调用函数,并将结构出入到下拉框容器中 selectbox.innerHTML = that.creatSelectTree(tree); }, listToTree:function(list,pid) { var that = this; var ret = [];//一个存放结果的临时数组 for(var i in list) { if(list[i].pid == pid) {//如果当前项的父id等于要查找的父id,进行递归 list[i].children = that.listToTree(list, list[i].id); ret.push(list[i]);//把当前项保存到临时数组中 } } return ret;//递归结束后返回结果 }, preFlag:"+",//前缀符号,用于显示父子关系,这里可以使用其它符号 creatSelectTree:function(d){ var that = this; var option=""; for(var i=0;i<d.length;i++){ if(d[i].children.length){//如果有子集 option += "<option value='" + d[i].id + "'>" + that.preFlag + d[i].name + "</option>"; that.preFlag += "-";//前缀符号加一个符号 option += that.creatSelectTree(d[i].children);//递归调用子集 that.preFlag = that.preFlag.slice(0,that.preFlag.length - 1);//每次递归结束返回上级时,前缀符号需要减一个符号 }else{//没有子集直接显示 option += "<option value='"+d[i].id+"'>" + that.preFlag + d[i].name + "</option>"; } } return option;//返回最终html结果 }
js 自动生成下拉树
原创rob_rookie ©著作权
©著作权归作者所有:来自51CTO博客作者rob_rookie的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
elementUI 下拉树
elementUI 下拉树之popover+tree+input组合实现方式。 ...
数据 输入框 复选框 弹出框 树形结构