依賴layui form模塊 復選框tree插件（拓展可根據屬性單選還是多選，數據反選）

　　近些天接的項目用的是layui。以前沒用過，踩了很多坑，坑就不多說了，直接說layui的tree。因為自帶的tree不滿足需求，所以在論壇、博客上找了很久終於找到了可以復選的的插件，原文地址：https://blog.csdn.net/xianglikai1/article/details/79032278。這里謝謝原作者，從源碼中學到了很多。

這里我就直接上代碼了。（注：因為數據結構問題我將源碼中的json數據結構title改為id，value改為name。勾選樹的獲取值未變：data.value）

    //創建tree
    var xtree = new layuiXtree({
        elem: xTree' //放xtree的容器（必填）
         , form: form              //layui form對象 （必填）
         , data: json              //數據，結構請參照下面 （必填）
         , isopen: true            //初次加載時全部展開，默認true （選填）
         , checked: true 
         , ischecked:  deptIds //初次加載勾選的數據。格式（a,b,c）
         , single:   single//是否為單選 ，默認為false（多選）
         , ckall: false    //啟用全選功能，默認值：false
         , color: "#039adf "           //圖標顏色 （選填） 
         , icon: {                 //圖標樣式 （選填）
             open: ""      //節點打開的圖標
             , close: ""   //節點關閉的圖標
             , end: "&#xe621"     //末尾節點的圖標
         }
        , click: function (data) {  //節點選中狀態改變事件監聽，全選框有自己的監聽事件
               //console.log(data.elem.leaf);//是否為葉子節點 
            //console.log(data.elem); //得到checkbox原始DOM對象
            //console.log(data.elem.checked); //開關是否開啟，true或者false
            //console.log(data.value); //開關value值，也可以通過data.elem.value得到
            //console.log(data.othis); //得到美化后的DOM對象
        }
    });

ischecked：初次加載勾選的數據。格式（a,b,c）。場景用於一些修改信息反勾選的；

single：true單選、false多選。（注：因場景要求我把父子關聯渲染注釋掉了）

另外在項目過程中，有一處需要CheckBox框與title分開，做成兩個點擊事件。我暫時屏蔽了。如果需要就改一下，然后在from，里面用jQuery獲取span標簽。記住一點要在from里面，不然沒效果。
改動的js文件地址：鏈接：https://pan.baidu.com/s/1iHYIEKeI3eVkFa6O8BCMwg 密碼：g31r。

效果圖就不上了，其實就是想給大家分享下，自己做個筆記，額，哈哈。。。再次謝謝原作者！