今天小編就爲大家分享一篇layui實現checkbox的目錄樹tree的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
廢話不多說啦,我就直接上代碼吧,需要的朋友可以過來參考下
layui.use([ 'tree' ], function() { $ = layui.jquery; form = layui.form; //獲取節點數據 getTreeData(); }); function getTreeData() { $.ajax({ url : path+"/RoleController/getResourceTree.do", type : "post", dataType : "json", data :{ "roleId":roleId, "id":null, "t":Math.random() } , error : function() { }, success : function(data) { treeData = JSON.stringify(data); initMenuTree(); } }); } // 加載列表 function initMenuTree() { //json數姐轉換成對象 treeData = eval( "(" + treeData + ")" ); //console.log(treeData); // 執行渲染 treeIns = layui.tree({ elem: '#demo', //指定元素,生成的樹放到哪個元素上 check: 'checkbox', //勾選風格 skin: 'as', //設定皮膚 drag: true,//點擊每一項時是否生成提示信息 checkboxName: 'aa[]',//複選框的name屬性值 checkboxStyle: "",//設置複選框的樣式,必須爲字符串,css樣式怎麼寫就怎麼寫 click: function(item) { //點擊節點回調 //alert(item); }, change: function (item){//噹噹前input發生變化後所執行的回調 //console.log(item); resourceIds=item; }, data: {//爲元素添加額外數據,即在元素上添加data-xxx="yyy",可選 hasChild: true }, nodes:treeData }); return treeIns; }
以上這篇layui實現checkbox的目錄樹tree的例子就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持神馬文庫。