精华内容
下载资源
问答
  • js获取layui tree选中的id

    千次阅读 2020-05-04 12:57:08
    1.框架layui 2.目标:获取tree选中的所有节点id 实现函数如下 function getChildNodes(treeNode, result) { for (var i in treeNode) { result.push(treeNode[i].id); resul...

    1.框架layui
    2.目标:获取tree选中的所有节点id
    实现函数如下

    
                
     function getChildNodes(treeNode, result) {
                for (var i in treeNode) {
                    result.push(treeNode[i].id);
                    result = getChildNodes(treeNode[i].children, result);
                }
                return result;
            }
    

    调用方法

    var checkedData = tree.getChecked('roletree'); //获取选中节点的数据
     var role = getChildNodes(checkedData,[]);
    
    展开全文
  • layui tree 动态赋值勾选的时候发现 勾选父级 所有子级默认都是勾选状态 与需求不合 解决: 修改如下: 断点执行 发现勾选节点的操作是在tree.js内处理的 在tree.js 92行处加入一个参数: checkChild: true ...

    layui版本 2.5.5      

      layui tree   动态赋值勾选的时候发现 勾选父级 所有子级默认都是勾选状态 与需求不合

            解决:

                修改如下:

                    断点执行 发现勾选节点的操作是在tree.js内处理的

                    在tree.js 92行处加入一个参数:  checkChild: true  用于动态控制  不影响原有功能

        //默认配置
        Class.prototype.config = {
            data: []  //数据
    
            ,showCheckbox: false  //是否显示复选框
            ,showLine: true  //是否开启连接线
            ,accordion: false  //是否开启手风琴模式
            ,onlyIconControl: false  //是否仅允许节点左侧图标控制展开收缩
            ,isJump: false  //是否允许点击节点时弹出新窗口跳转
            ,edit: false  //是否开启节点的操作图标
            ,checkChild: true //选中父级时 是否选选择所有子级
    
            ,text: {
                defaultNodeName: '未命名' //节点默认名称
                ,none: '无数据'  //数据为空时的文本提示
            }
        };

     

            337行 原代码

    //同步子节点选中状态
        if(typeof item.children === 'object' || elem.find('.'+ELEM_PACK)[0]){
          var childs = elem.find('.'+ ELEM_PACK).find('input[same="layuiTreeCheck"]');
          childs.each(function(){
            if(this.disabled) return; //不可点击则跳过
            this.checked = checked;
          });
        };

     

    修改后:

    if(typeof item.children === 'object' || elem.find('.'+ELEM_PACK)[0]) {
                //同步子节点选中状态
                if(options.checkChild){
                        var childs = elem.find('.'+ ELEM_PACK).find('input[same="layuiTreeCheck"]');
                        childs.each(function(){
                            if(this.disabled) return; //不可点击则跳过
                            this.checked = checked;
                        });
                }else{
                        if(!checked){
                            var childs = elem.find('.'+ ELEM_PACK).find('input[same="layuiTreeCheck"]');
                            childs.each(function(){
                                if(this.disabled) return; //不可点击则跳过
                                this.checked = checked;
                            });
                        }
                }
            }

     

     

    使用方法: 

      

    tree.render({
                elem: '#testTree'
                , checkChild: false
                , data: data

     在引入模块时传入上方的自定义参数 checkChild : false

      不传此参数 为原有实现 传入后勾选父节点 子节点不会选中

     

     

    如果本地下载的layui js代码可能是压缩后的编码,需要从git上下载源码然后修改

     参考文章: https://blog.csdn.net/nndjay/article/details/107857191

    展开全文
  • layui tree 递归获取的选中节点

    千次阅读 2020-05-16 19:26:26
    使用layui tree 获取已选中的数据的id /** * 获取layui tree模块的选中的所有id * @param arr 选中数据,树结构 * @returns {string|*} */ function getLayuiTreeIds(arr, list) { if (!list) list = []; for ...

    使用layui tree 获取已选中的数据的id

    /**
     * 获取layui tree模块的选中的所有id
     * @param arr 选中数据,树结构
     * @returns {string|*}
     */
    function getLayuiTreeIds(arr, list) {
        if (!list) list = [];
        for (const item of arr) {
            list.push(item.id);
            let subs = item.children;
            if (subs && subs.length > 0) {
                getLayuiTreeIds(subs, list);
            }
        }
        return list.join(',');	//以逗号拼接返回
    }
    
    // 调用
    let menus = getLayuiTreeIds(tree.getChecked('treeId'));
    // menus为 123,124,125
    
    展开全文
  • layui.use('tree', function () { var tree = layui.tree; //渲染 stree = tree.render({ elem: '#demo2' //绑定元素 , data: treeService .
    layui.use('tree', function () {
                        var tree = layui.tree;
                        //渲染
                        stree = tree.render({
                            elem: '#demo2'  //绑定元素
                            , data: treeService
                            , showCheckbox: true
                            , click: function (obj) { //节点选中状态改变事件监听,全选框有自己的监听事件
                                console.log(obj);
                                var nodes = document.getElementsByClassName("layui-tree-txt");
                                for (var i = 0; i < nodes.length; i++) {
                                    if (nodes[i].innerHTML === obj.data.title) {                       // if(obj.data.children){} //判断当前节点是否有子节点
                                        if (obj.data.children == null || obj.data.children.length == 0) {//判断是不是子节点(父节点对应的children不为空,且有的父节点长度为0也可代表子节点)
                                            nodes[i].style.color = "#555";//灰色
                                            nodes[i].checked = true;
                                            //将选中的值存储在Session
                                        } else {
                                            nodes[i].style.color = "#555";//灰色
                                        }
                                    } else {
                                        nodes[i].style.color = "#555";//灰色
                                    }
                                }
                            }
                        });
                    });

    展开全文
  • 设置LayUI tree 点击选中的样式

    千次阅读 2020-03-24 21:10:19
    解决思路,在点击选中后,获取当前点击的元素,然后给这个... .tree-txt-active{ color :red; } </style> <script> // 多选 $(document).click(function(e) { // 在页面任意位置点击而触发此事件 ...
  • 在做权限管理时用了layui tree 组件,编辑功能回显出现问题:只要父级被选中那么子级同样也会被选中 如下图所示,本来保存数据的时候只勾中了父级下的某个子级,但是在编辑的时候回显数据就会被全选 解决方案1 ...
  • 最近做权限管理后台,用了layui tree 组件,发现选中了父节点后,自动选中了子节点。不满足现实业务需求。所以微调了下源代码。 准备工作: 1.下载 layui 组件源码(layui-v2.5.6) 2.准备好tree demo 示例 ...
  • layui Tree勾选控制 唯一选中

    千次阅读 2020-06-17 15:34:18
    关于layui Tree控制只能单选的需求,附带解决展开节点时三角号无法正确切换的问题。 话不多说 直接上demo! 注意:代码中的 _.xx方法 使用的lodash.js 的函数 .transform-r90:after { transform: rotate(90deg); } ...
  • layui tree 获取已选中节点的ID

    千次阅读 2020-11-24 11:31:32
    layui版本2.5.5 项目需要 需要获取已勾选Tree节点的ID layui提供的方法是一个迭代后的 父子级关系数据结构 如果不... //得到选中节点 Class.prototype.getCheckedId = function(){ var that = this ,checkI...
  • 项目中 选中用户需要勾选展示该用户部门 如果用layui已有方法需要使用tree.render()重载 会进入后台重新请求 不想这么麻烦 也可以减少后台压力 在tree.js中添加如下方法 //设置取消选中 Class.prototype....
  • layui tree

    2021-05-18 10:14:02
    <!... <... <head>...Layui</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewp.
  • layui tree 获取复选框选中节点的id

    千次阅读 2020-04-11 15:48:14
    目录说明Code效果图 说明 官方文档提供的代码只能获取到根节点的id,没有进行树遍历,无法获取到子树的id. Code 官方文档提供的 ...//获得选中的节点 var checkData = tree.getChecked('demoId'); ...
  • layui tree取消父子联动

    2021-04-22 17:26:45
    最近改动一个老系统,发现原始layui tree当点击子级时,父级也会选中。因业务需要,需要将父子联动取消掉。因老版本的源代码未找到。索性将layui最新版本的tree.js源代码才gitee上copy下来进行修改。 tree.js变更点 ...
  • 有时候开发树形菜单权限管理,选择父节点不想子节点全部选中,经过我的修改现在可以做到。你可以试试。只需要覆盖项目 tree.js就可以。 layui2.5.4版本
  • layui 树形选 ,选中后确定, 再次选择后,把选中的值赋予树形框, 附带问题, 选择取消下级后 怎么把上级的选择状态取消掉。 ![图片说明](https://img-ask.csdn.net/upload/202007/12/1594487969_329736.png)
  • layui tree下拉框选择

    千次阅读 2019-01-22 09:29:30
    参考网址:https://www.cnblogs.com/yysbolg/p/8968992.html html代码 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&...layui&lt;/title&gt; &lt;meta n
  • layUI Tree 的使用

    2018-05-31 14:18:00
    原文作者:小巷而已【[layui-xtree 3.0]依赖layui form模块 复选框tree插件】 原文链接:https://blog.csdn.net/xianglikai1/article/details/79032278 js 代码 : <link href="layui/css/layui.css" ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 687
精华内容 274
关键字:

layuitree选中的