.NET2.0TreeView使用脚本模拟选中结点

前些天csdn有人问是否可以实现点击TreeNode的一行而不仅仅是点击TreeView的文字就可以选中该结点，我觉得用脚本是可以模拟做到的，特将结果写下来。既然是模拟，那么关键就是要骗过服务器端，让它真正为客户端所控制，我觉得这里的关键就是拼接出服务器端可认识的参数字符串。不难发现每个结点选中回传，参数是类似这样的－"sNew Node1//New Node2//New Node3//New Node4",所以一切也就明朗了。效果是点击结点左边空白区域同样选中了该结点。

<asp:TreeView ID="TreeView1" runat="server" ShowLines="True" onclick="javascript:showline()"
                OnSelectedNodeChanged="TreeView1_SelectedNodeChanged">
                <Nodes>
                    <asp:TreeNode Text="New Node1" Value="New Node1">
                        <asp:TreeNode Text="New Node2" Value="New Node2">
                            <asp:TreeNode Text="New Node3" Value="New Node3">
                                <asp:TreeNode Text="New Node4" Value="New Node4">
                                    <asp:TreeNode Text="New Node5" Value="New Node5">
                                        <asp:TreeNode Text="New Node6" Value="New Node6"></asp:TreeNode>
                                    </asp:TreeNode>
                                </asp:TreeNode>
                            </asp:TreeNode>
                        </asp:TreeNode>
                    </asp:TreeNode>
                </Nodes>
</asp:TreeView>

 

<script type="text/javascript"> 
function showline() 
{ 
    //从点击行获取最外层table对象 
    var the_tab = get_Element(event.srcElement,"table"); 
    var cells = the_tab.rows[0].cells.length-1; 
    //获取最后一列内部html 
    var html = the_tab.rows[0].cells[cells].innerHTML; 
    var subhtml = html.substring(html.indexOf('id='),html.length-html.indexOf('id=')); 
    //获取nodeid 
    var nodeid = subhtml.substring(3,subhtml.indexOf(' '));  
    var theobj = document.getElementById(nodeid); 
  
    var num = nodeid.replace( "TreeView1t"," "); 
    //数组存放从根结点到现节点的路径 
    var result= new   Array();  
    result.push(theobj.innerText);  
     
    //将父节点text存到result 
    for(var j=num-1;j  >=0;j--)  
    {  
        var up = document.getElementById("TreeView1t"+j);  
        if(getlayer(up)  <getlayer(theobj)&&getlayer(up) >=2)  
        {  
            result.push(up.innerText);  
        }  
    }          
     
    //拼接回传参数字符串 
    var layers = "s";  
    for(var k=result.length-1;k  >=0;k--)  
    {  
       layers+=result[k]+ '/';//关键是这里不需要再加转义字符 ' ' 
    }  

    layers = layers.substring(0,layers.length-1); 
    //将treeview手动postback 
    __doPostBack( 'TreeView1',layers); 
} 


//获取上层节点对象 
function get_Element(the_ele,the_tag){ 
the_tag = the_tag.toLowerCase(); 
if(the_ele.tagName.toLowerCase()==the_tag)return the_ele; 
while(the_ele=the_ele.offsetParent){ 
if(the_ele.tagName.toLowerCase()==the_tag)return the_ele; 
} 
return(null); 
} 

//获取当前点击行的层数 
function getlayer(obj)  
{  
   return obj.parentElement.parentElement.parentElement.rows[0].cells.length; 
}  
</script>

 

protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
{
      Response.Write(this.TreeView1.SelectedNode.Text);
}