对微软那棵TreeView进行试用，主要是对CheckBox进行操作

总结这次的工作,明白了几个关键的地方:
    1.如果在服务器端进行CheckBox的初始化,这样操作就会导致在客户端进行node.getAttribute("checked")时总是得到True,这样就达不到客户端操作的目的.
    2.如果想在生成树的时候对某些节点进行CheckBox的初始化选中,就需要在客户端进行遍历树的操作(构造生成树的同时进行).
    3.在客户端对树的节点进行选中与取消选中的操作时,必须同时进行一个必要的操作:Tree.queueEvent('oncheck',node.getNodeIndex()),这样做的目的使你在客户端进行树操作的同时,能让服务器端也同时知道操作了哪些节点,以便在服务器端进行遍历的同时能知道哪些节点被选中.
    4.以及'checked'的大小写问题也会对树的状态改变有所影响.

之后又对代码进行了优化，我把生成树时的初始化操作，以及保存选中状态都放在了客户端进行！

第一次发表文章，请各位前辈多多指导，多多帮助

var  strArray  =   new  Array();
var  strList  =   "" ;

function  tree_oncheck()
{
    var ChildNode = new Array();
    var node = document.getElementById("TreeView1").getTreeNode(event.treeNodeIndex);
    var Pchecked = node.getAttribute("checked");
    
    ChildNode =  node.getChildren();
    if( parseInt( ChildNode.length ) != 0 )
    {
       node.setAttribute("checked",!Pchecked);
       return;
    }
    setParent(node,Pchecked);
    document.getElementById("TreeView1").queueEvent('oncheck',node.getNodeIndex());
}
// ===============================================//
// 在点击子节点时,让父节点的状态也随子节点的状态而变化
// ===============================================//
function  setParent(el,state)
{
    var ParentNode = el.getParent();
    if(ParentNode)
    {
        //检查el的兄弟节点状态
        if(!checkSiblingdNode(el))
        {
            ParentNode.setAttribute('checked',state);
            setParent(ParentNode,state);
        }
    }
}

// ===========================================//
// 检查兄弟节点状态
// ===========================================//
function  checkSiblingdNode(el)
{
    var parentNode = el.getParent();
    var childNodes = new Array();
    childNodes = parentNode.getChildren();
            
    for(var i=0;i< childNodes.length; i++)
    {
        if(el.getNodeIndex() != childNodes[i].getNodeIndex())
        {
            if(childNodes[i].getAttribute("Checked"))
            {
                return true;
            }
        }
    }
    return false;
}
// =============================================//
// 点击父节点时,对其子节点状态进行同步改变
// =============================================//
function  setcheck(node,Pc)
{
    var ChildNode = new Array();
    ChildNode = node.getChildren();
    if( parseInt(ChildNode.length) != 0 )
    {
        for( var i=0; i<ChildNode.length;i++ )
        {
            var cNode = ChildNode[i];
            if( cNode.getAttribute("checked") != Pc )
            {
                if( parseInt( cNode.getChildren().length ) != 0 )
                    setcheck(cNode,Pc);
                cNode.setAttribute("checked",Pc);
                document.getElementById("TreeView1").queueEvent('oncheck',cNode.getNodeIndex());
            }
        }
    }
}
// ==========================================//
// 需要对某些节点做初始化处理时
// ==========================================//
function  onload()
{
    var node 
    var nextNode = 0;
    var childNodes = new Array();
    var childNodes = document.getElementById("TreeView1").getChildren();

    SetArray();//把节点ID组合为一个数组
    for(var i=0;i<childNodes.length;i++)
    {    
        SetTree(childNodes[i]);
    }
}
// ============================================//
// 组合数组
// ============================================//
function  SetArray()
{
    var IndexStart = 0;
    var IndexEnd = 0;
    var ArrIndex = 0;
    var SignStr = "";
    //var SpanString = "0001,00010001,000100010001,";
    var SpanString = document.getElementById("H_IncomeCode").value;
    var strLen = SpanString.length;
            
    while( IndexEnd < strLen )
    {
        SignStr = SpanString.substr(IndexEnd,1);
        if( SignStr == "," )
        {
            var TempString = SpanString.substr(IndexStart,IndexEnd-IndexStart);
            strArray[ArrIndex] = TempString;
                    
            IndexStart = IndexEnd + 1;
            ArrIndex = ArrIndex + 1;
        }
        IndexEnd = IndexEnd + 1;
    }
}
// ==============================================//
// 遍历整棵树,进行节点的Checked的初始化设置//
// ==============================================//
function  SetTree(node)
{
    var childNodes = new Array();
    childNodes = node.getChildren();
    var i = 0;
    var j = 0;
            
    for( i=0 ; i<strArray.length; i++ )
    {
        if( strArray[i] == node.getAttribute("ID") )
        {
            saveCheckState(node);
            node.setAttribute("checked","true");
                    //saveCheckState(node.getNodeIndex());
        }
    }
    if( parseInt(childNodes.length) != 0 )
    {
        for( j=0;j< parseInt(childNodes.length); j++)
        {
            for( i=0 ; i< parseInt(strArray.length); i++ )
            {
                if( strArray[i] == childNodes[j].getAttribute("ID") )
                {
                    saveCheckState(childNodes[j]);
                    childNodes[j].setAttribute("checked","true");
                    //saveCheckState(childNodes[j].getNodeIndex());
                }
            }
            SetTree(childNodes[j]);
        }
    }
    else
    {
        for( i=0 ; i<strArray.length; i++ )
        {
            if( strArray[i] == node.getAttribute("ID") )
            {
                saveCheckState(node);
                node.setAttribute("checked","true");
                //saveCheckState(node.getNodeIndex());
            }
        }
    }
}
// ====================================================//
// 保存节点状态(保证在回传时节点状态依然存在)
// ====================================================//
function  saveCheckState(el)
{
    if(el.getNodeIndex())
    {
        document.getElementById("TreeView1").queueEvent("oncheck",el.getNodeIndex().toString());
    }
}
// ====================================================//
// 点击保存按钮时对所选中的节点进行整理
// ====================================================//
function  FindChecked()
{
    strList = "";
    var ChildNodes = new Array();
    ChildNodes = document.getElementById("TreeView1").getChildren();
    for( var i=0; i<ChildNodes.length; i++ )
    {
        CheckedAll(ChildNodes[i]);
    }
    //alert(strList);
    doSelect(strList);
}
function  CheckedAll(node)
{
    var i = 0;
    var strID;
    var childNodes = new Array();
    childNodes = node.getChildren();
            
    if( parseInt(childNodes.length) != 0 )
    {
        for( i=0; i<parseInt(childNodes.length); i++ )
        {
            CheckedAll(childNodes[i]);
        }
    }
    else
    {
        if( node.getAttribute("checked") == true )
        {
            strID = node.getAttribute("id");
            strList = strList + strID + ",";
        }
    }            
}

 

转载于:https://www.cnblogs.com/hmilycsharp/archive/2006/07/13/450071.html