Layui的Tree组件如何实现取消全选?

前言

在开发云控系统的任务控制功能时,遇到一个Tree组件的选中问题。
在实现了选中在线、选中离线、全选功能后,还需要实现取消全选。

但是Layui的早期版本中,Tree组件并没有提供取消全选的功能。
怎么办?

file

解决办法

先百度查一下,发现有两种方案。
一种是在点击事件里实现。
另一种,是修改tree的源码,添加取消选中的方法。

    //设置取消选中
    Class.prototype.qxChecked = function(){
        var that = this;

        //初始选中
        that.elem.find('.'+ELEM_SET).each(function(i, item){
            var thisId = $(this).data('id')
                ,input = $(item).children('.'+ELEM_ENTRY).find('input[same="layuiTreeCheck"]')
                ,reInput = input.next();

            if(input[0].checked){
                reInput.click();
            }
        });
    };

这两种方法,都不太高明。
有没有更好的办法呢?

在思考的过程中,飞云突然灵机一动:
重新加载Tree,不就可以实现取消全选吗?
哈哈哈!大道至简啊!

想到这,立即动手去实现。

tree.reload('myTreeList');

经过测试,效果完全可以。

1. 官方交流QQ群,添加多个不批。建议使用安卓手机或电脑申请。
Auto.js学习交流③群:286635606
Auto.js学习交流②群:712194666(满员)
IOS免越狱自动化测试群:691997586
EasyClick学习交流①群:737066890
2. 盗版,破解有损他人权益和违法作为,请各位会员支持正版。
3. 本站部分资源来源于用户上传和网络搜集,如有侵权请提供版权证明并联系站长删除。
4.如未特别申明,本站的技术性文章均为原创,未经授权,禁止转载/搬运等侵权行为。
5.全站所有付费服务均为虚拟商品,购买后自动发货。售出后概不接受任何理由的退、换。注册即为接受此条款。
6.如果站内内容侵犯了您的权益,请联系站长删除。
飞云脚本 » Layui的Tree组件如何实现取消全选?

企业级大数据智能营销管理系统

了解详情