javascript实现TreeView 无刷新展开的实例代码

2019-12-24,,,,

复制代码 代码如下:
function public_GetParentByTagName(element, tagName) 
{
    var parent = element.parentNode;
    var upperTagName = tagName.toUpperCase();
    //如果这个元素还不是想要的tag就继续上溯
    while (parent && (parent.tagName.toUpperCase() != upperTagName)) 
    {
        parent = parent.parentNode ? parent.parentNode : parent.parentElement;
    }
    return parent;
}
//设置节点的父节点Cheched——该节点可访问,则他的父节点也必能访问
function setParentChecked(objNode)

    var objParentDiv = public_GetParentByTagName(objNode,"div");
    if(objParentDiv==null || objParentDiv == "undefined")
    {
        return;
    }
    var objID = objParentDiv.getAttribute("ID");
    objID = objID.substring(0,objID.indexOf("Nodes"));
    objID = objID+"CheckBox";
    var objParentCheckBox = document.getElementById(objID);
    if(objParentCheckBox==null || objParentCheckBox == "undefined")
    {
        return;
    } 
    if(objParentCheckBox.tagName!="INPUT" && objParentCheckBox.type == "checkbox")
    return; 
    objParentCheckBox.checked = true;
    setParentChecked(objParentCheckBox);
}
//设置节点的子节点uncheched——该节点不可访问,则他的子节点也不能访问
function setChildUnChecked(divID)

    var objchild = divID.children;
    var count = objchild.length; 
    for(var i=0;i<objchild.length;i++)
    {
        var tempObj = objchild[i];
        if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox")
        {
            tempObj.checked = false;
        }
        setChildUnChecked(tempObj); 
    }
}
//设置节点的子节点cheched——该节点可以访问,则他的子节点也都能访问
function setChildChecked(divID)

    var objchild = divID.children;
    var count = objchild.length; 
    for(var i=0;i<objchild.length;i++)
    {
        var tempObj = objchild[i];
        if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox")
        {
            tempObj.checked = true;
        }
        setChildChecked(tempObj); 
    }
}
//触发事件
function CheckEvent()
{
    var objNode = event.srcElement; 
    if(objNode.tagName!="INPUT" || objNode.type!="checkbox")
    return;
    if(objNode.checked==true)
    {
        setParentChecked(objNode);
        var objID = objNode.getAttribute("ID");
        var objID = objID.substring(0,objID.indexOf("CheckBox")); 
        var objParentDiv = document.getElementById(objID+"Nodes");
        if(objParentDiv==null || objParentDiv == "undefined")
        {
            return;
        } 
        setChildChecked(objParentDiv);
    }
    else
    {
        var objID = objNode.getAttribute("ID");
        var objID = objID.substring(0,objID.indexOf("CheckBox")); 
        var objParentDiv = document.getElementById(objID+"Nodes");
        if(objParentDiv==null || objParentDiv == "undefined")
        {
            return;
        } 
        setChildUnChecked(objParentDiv);
    }
}

服务端控件
复制代码 代码如下:
this.tvPrivilege.Attributes.Add("OnClick", "CheckEvent()");  

您可能感兴趣的文章:

  • Bootstrap树形菜单插件TreeView.js使用方法详解
  • 动态加载dtree.js树treeview(示例代码)
  • JS控件ASP.NET的treeview控件全选或者取消(示例代码)
  • js获取Treeview选中的节点(C#选中CheckBox项)
  • js获取TreeView控件选中节点的Text和Value值的方法
  • 用js脚本控制asp.net下treeview的NodeCheck的实现代码
  • 选择TreeView控件的树状数据节点的JS方法(jquery)
  • Javascript 实现TreeView CheckBox全选效果
  • javascript-TreeView父子联动效果保持节点状态一致
  • JS控制TreeView的结点选择

《javascript实现TreeView 无刷新展开的实例代码.doc》

下载本文的Word格式文档,以方便收藏与打印。