前言:
ztree官方給的api可以設定勾選乙個節點的同時勾選子節點或者父節點,也可以設定不影響父子節點,即將chkboxtype設定為,而有時我們希望實現這樣的功能,點選乙個節點判斷他所有的父節點和子節點,如果有選中的話就取消勾選,這樣的話官方貌似沒有給出有效的解決方案,這篇文章記錄一下我是怎麼解決這個問題的。
需求:
點選乙個節點,判斷他所有的父節點和子節點,如果有選中的節點,則取消選中。
實現步驟:
首先看下官方給的api
這裡給個傳送門:點選這裡
可以看到其實官方給的是這樣的邏輯:
假設有這樣一組資料:
江蘇、南京、xx區域、xx街道、xx小區
那麼在勾選南京的時候其實要麼選中所有子節點、要麼選中所有父節點。或者不影響父子節點。
而要實現上面的需求肯定是要先設定為不影響父子節點,如下所示效果:
然後迴圈遍歷其父節點和子節點,設定checked屬性為false即可;
幾點需要注意的:
1.這裡子節點是乙個遞迴操作,子節點的子節點也應該被取消選中。
2.treenode.getpath();可以獲取當前節點的所有父節點,包括他自己,所以要把自身排除。
3.每次設定完checked屬性為false之後,應該更新一下節點,否則沒有直接效果,滑鼠滑過才會有效果。
示例**如下:
functioncustombeforecheck(event, treeid, treenode,treeobj)
var parennodes =treenode.getpath();
for(var i=0;i) }}
function
recursion(node,treeobj)
}else
treeobj.updatenode(node);
}
Ztree 載入資料預設不勾選父節點
隨筆記錄,ztree 載入資料子節點全部勾選預設是不勾選父節點,官方說法是不干預使用者資料。而某些場景下我們又需要這樣做,有兩種辦法處理,1 在初始化ztree前處理資料中的checked 2 初始化ztree後利用checknode來處理勾選 本人使用這種 直接上 1 設定父節點勾選狀態 2fun...
jQuery 控制勾選和去勾選
input ratio勾選控制 id prop checked true 勾選 id prop checked false 去勾選注意 一定用prop而不是用attr來控制。目前專案使用的jq版本是3.1.1,在這個版本中,類似於 id attr checked checked id removea...
Ztree 多選,顯示勾選的路徑
專案要求,需要向後台傳遞已經勾選的路徑,如 l1 a,l1 l3 c,l1 l3 d 如果是全選狀態則只傳遞全選狀態的路徑,不傳子節點 具體可以參考jq ztree 的 v3.5 版本 1 var mesetting 10edit 18 19check 22data 26 27callback 31...