一個帶CheckBox的樹形目錄javascript的遞迴演算法
var head="display:''"
img_close=new Image()
img_close.src="/sysManage/images/f.gif"
img_open=new Image()
img_open.src="/sysManage/images/fo.gif"
img3=new Image()
img3.src="/sysManage/images/e.gif";
var elment = img_close.src
function onMouseDown(){
if(!document.all)return
var eventObj = event.srcElement;
if(eventObj.tagName=="IMG" ) {
//判斷是否存在子節點
var sSrc = eventObj.src ;
if(sSrc == null || sSrc.length<=0)return;
if(sSrc.indexOf("e.gif") >= 0)return;
if(sSrc.indexOf("f")<0 && sSrc.indexOf("tree-site")<0 )return;
var nOffIndex = 2;
var srcIndex = eventObj.sourceIndex;
var nested = document.all[srcIndex + nOffIndex];
if(nested.tagName!="DL"){
nested = document.all[srcIndex + 1];
}
if (nested.style.display=="none") {
nested.style.display='inline';
if(sSrc.indexOf("f.gif")>0)
eventObj.src = img_open.src;
}
else {
nested.style.display="none";
if(sSrc.indexOf("fo.gif")>0)
eventObj.src = img_close.src;
}
}else if(eventObj.tagName == "A" ){//相應節點的點選
var nChnlId = parseInt(eventObj.name);
if(!isNaN(nChnlId)){
onClickChannel(nChnlId);
}
}
}
/** 選中某個節點下的所有子節點(主要用於許可權樹的選擇).
* @param obj 節點選擇框物件(checkbox物件)
*根據所選節點的值,遍歷整個樹,從而選中滿足條件的節點.
*/
/*
function checkNode(obj) {
for (var i=0;i
if (form1.chkID[i].value.length > obj.value.length && form1.chkID[i].value.substring(0,obj.value.length) == obj.value)
{
if(obj.checked)
{
form1.chkID[i].checked = true;
}
else
{
form1.chkID[i].checked = false;
}
}
}
}
*/
function checkNode(obj)
{
var elm = obj.parentNode;
checkChildrenRecurve(elm);
//checkRootRecurve(document.getElementById("root"));
}
function checkChildrenRecurve(elm)
{
var dd = elm;
var dl = dd.lastChild;
if (dl.tagName != "DL") return;
var ddlist = dl.children;
for (var i=0;i
ddlist[i].firstChild.checked=elm.firstChild.checked;
checkChildrenRecurve(ddlist[i].firstChild.parentNode)
}
}
function checkRootRecurve(dl)
{
if (dl.tagName != "DD")
{
dl.parentNode.firstChild.firstChild.allChecked = dl.parentNode.firstChild.firstChild.checked;
dl.parentNode.firstChild.firstChild.allUnChecked = !dl.parentNode.firstChild.firstChild.checked;
return;
}
var lis = dl.children;
var allChecked = true;
var allUnChecked = true;
for (var i=0;i
checkRootRecurve(lis[i].lastChild);
allChecked = allChecked && lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allUnChecked;
}
dl.parentNode.firstChild.firstChild.allChecked=allChecked;
dl.parentNode.firstChild.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked)
{
dl.parentNode.firstChild.firstChild.checked=allChecked;
dl.parentNode.firstChild.firstChild.disabled=false;
dl.parentNode.firstChild.childStatus=false;
}
else
{
dl.parentNode.firstChild.firstChild.disabled=true;
dl.parentNode.firstChild.childStatus=true;
dl.parentNode.firstChild.firstChild.checked=true;
}
}
document.onclick=onMouseDown
/**
*如果所有子節點都被選中,然麼父節點也要選中
*output:無
*/
function selParentNode(nodeIDStr,spltStr){
var nodeLen=nodeIDStr.length;
var nodeList;
if(nodeLen<1){
return;
}
nodeIDList = nodeIDStr.split(spltStr);
for (j=0;j
if(checkSubNode(nodeIDList[j]))
{
for (var k=0;k
if(form1.chkID[k].value == nodeIDList[j] )
{
form1.chkID[k].checked = true;
break;
}
}
}
}
}
/**
* 判斷某個節點值下的所有子節點是否被選中(主要用於許可權樹的選擇).
* curNodeID 某個節點的值
*output:true 或 false
**/
function checkSubNode(curNodeID) {
for (var i=0;i
if (form1.chkID[i].value.substring(0,curNodeID.length) == curNodeID && form1.chkID[i].value.length >= (curNodeID.length +2) )
{
if(!form1.chkID[i].checked )
{
return false;
}
}
}
return true;
}
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/6517/viewspace-145587/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 遞迴函式-樹形列表遞迴函式
- 遞迴樹形查詢所有分類遞迴
- Vue遞迴元件+Vuex開發樹形元件Tree--遞迴元件Vue遞迴元件
- JavaScript演算法之遞迴JavaScript演算法遞迴
- 如何優雅的使用javascript遞迴畫一棵結構樹JavaScript遞迴
- [演算法系列]遞回應用——二叉樹(2):一種帶資訊遞迴返回的求解方式演算法二叉樹遞迴
- 二叉樹——後序遍歷的遞迴與非遞迴演算法二叉樹遞迴演算法
- JavaScript中的遞迴JavaScript遞迴
- 什麼是遍歷二叉樹,JavaScript實現二叉樹的遍歷(遞迴,非遞迴)二叉樹JavaScript遞迴
- 瞭解 JavaScript 的遞迴JavaScript遞迴
- 樹遞迴問題的求解遞迴
- php 遞迴一棵樹PHP遞迴
- Vue遞迴元件實現樹形結構選單Vue遞迴元件
- JavaScript遞迴JavaScript遞迴
- 用 JavaScript 的方式理解遞迴JavaScript遞迴
- JavaScript和ABAP的尾遞迴JavaScript遞迴
- 目標和——遞迴的實踐遞迴
- 二叉樹的遞迴套路二叉樹遞迴
- 一道Postgresql遞迴樹題SQL遞迴
- 每日一演算法:遞迴演算法遞迴
- 遞迴處理複製變數目錄按原路徑複製到新目錄的指令碼遞迴變數指令碼
- 二叉樹的四種遍歷(遞迴與非遞迴)二叉樹遞迴
- 利用非遞迴演算法來搜尋二叉樹中的某個元素java遞迴演算法二叉樹Java
- JavaScript之遞迴的簡單使用JavaScript遞迴
- 揹包問題的遞迴與非遞迴演算法遞迴演算法
- 一個vuepress配置問題,引發的js遞迴演算法思考VueJS遞迴演算法
- 【Java資料結構與演算法筆記(二)】樹的四種遍歷方式(遞迴&非遞迴)Java資料結構演算法筆記遞迴
- Java遞迴演算法的使用Java遞迴演算法
- 遍歷二叉樹-------遞迴&非遞迴二叉樹遞迴
- 記一次通過 Resource 遞迴生成樹的方案遞迴
- 記錄一次遞迴查詢的運用遞迴
- Javascript中的尾遞迴及其優化JavaScript遞迴優化
- 遍歷二叉樹的遞迴與非遞迴程式碼實現二叉樹遞迴
- Python基礎之棧與佇列及遞迴目錄Python佇列遞迴
- win10系統下顯示資料夾樹形目錄的方法Win10
- JS遞迴過濾樹形結構陣列物件--模糊查詢JS遞迴陣列物件
- 通用-遞迴樹結構遞迴
- Vue一個案例引發的遞迴元件的使用Vue遞迴元件
- 圖形輔助,理解遞迴遞迴