全選

//全選$('#c_all').on('click',function (e) {var zTree = $.fn.zTree.getZTreeObj("treeMenu");//得到tree對象 treeMenu是我的treeidvar node = zTree.getNodes();//得到全部節點var nodes = zTree.transformToArray(node);//全部節點轉換成數組arrayvar checkNode = zTree.getCheckedNodes().length;//得到被選中的節點數量,zTree.getCheckedNodes()和zTree.getCheckedNodes(true)一樣,可以傳參(true/false),默認是trueif (checkNode < nodes.length) {//已選中的節點數小于總數 - 全選$('#all').prop('checked', true)zTree.checkAllNodes(true);//給全部節點設置為true} else{zTree.checkAllNodes(false);//給全部節點設置為false}});

反選

//反選$("#f_all").click(function (e) {var zTree = $.fn.zTree.getZTreeObj("treeMenu"); //ztree對象var checked = zTree.getCheckedNodes(true);//得到選中的節點var checkeds = zTree.transformToArray(checked); //轉變為數組var checkNode = zTree.getCheckedNodes(true).length;//選中的節點數量var node = zTree.getNodes();//全部節點var nodes = zTree.transformToArray(node);//全部節點數量if(checkNode< nodes.length){//已選中的節點數小于總數 - 全選zTree.checkAllNodes(true);//給所有的都設置為true$.each(checkeds, function(index,node) {//之前選中的節點為falsezTree.checkNode(node, false, false);});}else{zTree.checkAllNodes(false);//否則所有的都設置為false}});

全不選 取消 清空

//清空 $('#r_all').on('click',function (e) {var zTree = $.fn.zTree.getZTreeObj("treeMenu");//ztree對象zTree.checkAllNodes(false);//設置全部為false,不選中節點});

渲染tree+提交tree(layer的彈窗)

layer.open({type: 1,title: '菜單管理',area: ['600px', '470px'],offset: '50px',content: '<div style="text-align:center;margin-top:10px">' +'<button type="button" class="layui-btn layui-btn-primary layui-btn layui-btn-sm" id="c_all" lay-filter="c_all" >全選</button> '+'<button type="button" class="layui-btn layui-btn-primary layui-btn layui-btn-sm" id="f_all" lay-filter="f_all" >反選</button> '+'<button type="button" class="layui-btn layui-btn-danger layui-btn layui-btn-sm" id="r_all" lay-filter="r_all" >清空</button></div>' +'<ul id="treeMenu" class="ztree" style="padding: 25px 0px 20px 60px;"></ul>',btn: ['保存', '關閉'],btnAlign: 'c',success: function (layero, index) {$(layero).children('.layui-layer-content').css('overflow-y', 'auto');layer.load(2);var setting = {check: {enable: true},data: {simpleData: {enable: true}}};admin.req('api-user/menus/'+roleId+'/'+systemId+'/menus', {}, function (data) {$.fn.zTree.init($('#treeMenu'), setting, data);layer.closeAll('loading');}, 'GET');},yes: function (index) {layer.load(1);var treeObj = $.fn.zTree.getZTreeObj('treeMenu');var nodes = treeObj.getCheckedNodes(true);var ids = new Array();for (var i = 0; i < nodes.length; i++) {ids[i] = nodes[i].id;}var data = new Object();data.roleId = roleId;data.menuIds = ids;admin.req('api-user/menus/granted', JSON.stringify(data) , function (data) {layer.closeAll('loading');if (0 == data.resp_code) {layer.msg(data.resp_msg, {icon: 1, time: 500});layer.close(index);} else {layer.msg(data.resp_msg, {icon: 2, time: 500});}}, 'POST');}});

總結

以上是生活随笔為你收集整理的ZTree的全选 反选 全不选 取消 清空的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。