ASP.NET 2.0实现自带TreeView的客户端连带选择

关于TreeView连带选择的功能估计很多人都写过，如果用服务器端事件来写比较方便，但是多了一层服务器端交互，系统易用性也上不太好，所以还是把这些功能的处理放在客户端会好一些。

功能说明：

A、选中某节点后会默认选中其所有子节点和其所有父节点的CheckBox

B、取消选中某节点后会取消选中其所有子节点的CheckBox，如其父节点下尚有其他子节点被选中，则不取消父节点CheckBox，如没有，则取消选中所有父节点的CheckBox

简单写了些客户端代码，可以直接放到JS文件中使用，希望对大家能有帮助。

1、首先是服务器端加一段代码，进行客户脚本注册

this.TVMenus.Attributes.Add("onclick", "CheckEvent();");

2、其次是下面的客户端脚本，我把它直接放到一个专用的JS文件中

1 //客户端捕捉事件

2 function  CheckEvent()

3 {

4     var  objNode  =  event.srcElement;

5     if(objNode.tagName == "INPUT"  &&  objNode.type== "checkbox")

6     {

7         var objParentDiv = objNode.id.replace("CheckBox","Nodes");

8         if(objNode.checked==true)

9         {

setChildCheckState(objParentDiv,true);

setParentCheckeState(objNode,true);

}

else

{

setChildCheckState(objParentDiv,false);

if(!HasOtherChecked(objNode)){

setParentCheckeState(objNode,false);

}

}

}

}

//判断是否有并行的其他节点被选中

function HasOtherChecked(objNode)

{

var  objParentDiv  =  WebForm_GetParentByTagName(objNode, "div");

var chks = objParentDiv.getElementsByTagName("INPUT");

for(var i=0;i<chks.length;i++){

if(chks[i].checked && chks[i].id != objNode.id)

{

return true;

}

}

return false;

}

//设置父节点

function  setParentCheckeState(objNode,chkstate)

{

try{

var  objParentDiv  =  WebForm_GetParentByTagName(objNode, "div");

if(objParentDiv == null  ||  objParentDiv  ==  "undefined "){

return;

}

else{

var objParentChkId = objParentDiv.id.replace("Nodes","CheckBox");

var objParentCheckBox = document.getElementById(objParentChkId);

if(objParentCheckBox){

objParentCheckBox.checked = chkstate;

setParentCheckeState(objParentDiv,chkstate);

}

}

}

catch(e){}

}

//设置子节点

function  setChildCheckState(nodeid,chkstate)

{

var node = document.getElementById(nodeid);

if(node){

var chks = node.getElementsByTagName("INPUT");

for(var i=0;i<chks.length;i++){

chks[i].checked = chkstate;

}

}

}