js用于树型结构级联选择

js|树型结构

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>及联选择-用于权限选择比较合适</title>
</head>

<body>
<ul id="tree">
    <li><input type=checkbox>
        <ul>
            <li><input type=checkbox>
                <ul>
                    <li><input type=checkbox></li>
                    <li><input type=checkbox></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>
</body>
<script language="javascript">

var arr = tree.getElementsByTagName('input')
for(var i=0; i<arr.length; i++){
    var input = arr[i]
    if(input.type = 'checkbox'){
        input.onclick = ClickInput
    }
}

function ClickInput(){
    var li = this.parentElement;
    var arr = li.getElementsByTagName('input')
    for(var i=0; i<arr.length; i++){
        var input = arr[i]
        if(input.type == 'checkbox'){
            input.checked = this.checked
        }
    }
    var li = li.parentElement.parentElement
   
    while(li.tagName.toLowerCase() == 'li'){
        var input = li.childNodes[0]
        if(input.tagName.toLowerCase() == 'input'){
            input.checked = this.checked
        }
        li = li.parentElement.parentElement
    }
}

</script>
</html>

时间: 2024-11-02 07:49:16

js用于树型结构级联选择的相关文章

网页制作实例:js用于树型结构级联选择

js|树型结构|网页 <html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>及联选择-用于权限选择比较合适</title></head><body><ul id="tree">    <li><input type=

树型结构~无限级联下拉列表框

这个问题困扰了我很久,今天终于把它解决了,心中的喜悦可想而知,赶快把它记录一下 标题无限级联下拉列表框的含义: 可能有一个树型结构的表,它可能有ID,Name,ParentID,Level等字段,下面要实现的就是从一级节点开始,一级一级的列出来,并以 下拉列表框的形式体现出来,就像是N级联动. 效果图: 两个问题: 1 建立操作时的联动,它不需要进行自动绑定 2 编辑操作时的联运,它需要根据子节点,逐级自己绑定到父节点,直到根 实现: JS代码 1 <script type="text/j

dtree和jquery构建树型结构

对于小型的树型应用来说,dtree是一个不错的选择. 先看一眼dtree给的例子 构造静态树 首先引入css文件和js文件 <link rel="StyleSheet" href="dtree.css" type="text/css" /> <script type="text/javascript" src="dtree.js"></script> 构造静态树其实很简单

AJAX实现动态树型结构

ajax|动态|树型结构 树型结构是一类应用非常广泛的数据结构.人类社会中宗族的族谱和现代企业的组织形式都是树型结构.在计算机领域中,文件系统中文件的管理结构.存储器管理中的页表.数据库中的索引等也都是树型结构.随着Internet的飞速发展,树型结构在浏览器/服务器(Browser/Server,简称B/S)应用系统的应用也越来越广泛. 目前,在互联网上广泛存在.应用的树型结构一般分为两种:静态和动态结构.静态结构存在最多.实现简单,但是静态导致不能改变树的结构和内容,无法反映树的节点信息的变

基于AJAX的动态树型结构的设计与实现

ajax|动态|设计|树型结构 <B>摘 要</B>:简要介绍了一种通用的,动态树型结构的实现方案,该方案基于Asynchronous JavaScript and XML,结合Struts框架设计实现了结构清晰.扩展性良好的多层架构,数据存储于数据库,结合XML描述树的节点信息,使得任何按预定的XML文档描述的信息都可以通过动态树来展现.<br /><table border="0" cellspacing="0" cel

带数据库的ajax+asp无限级分类树型结构,好东西别错过!

跟大家分享一下自己写的一个树型结构,参考了动力文章的无限极分类树形结构数据库,看演示吧http://asptree.guaishi.org/aspajax/ 下面是核心类代码,注释是后来加的,可能有些写的不太正确 复制内容到剪贴板 代码: <%'数据库字段为类属性,添加.删除.修改.操作检查等函数为类的方法Class Cls_Leibie    Private nClassID,sClassName,nParentID,sParentPath,nDepth,nRootID,nChild,nOrd

JSP实现论坛树型结构的具体算法

js|树型结构|算法 实现论坛树型结构的算法很多,我现在的JSP论坛采用的也是当中的一种:不用递归实现树型结构的算法,现在我将论坛树型结构的具体算法和大家介绍一下,和大家一起交流. 1.演示表的结构: 表名:mybbslist 字段 数据类型 说明 BBSID 自动编号 RootID Int 根帖ID,本身为根帖则RootID = ID FID Int 父帖ID,上一层帖子的ID,如是根帖则FID = 0 DEPTH Int 根帖Level=0,其他依据回复的深度递增 BBSSubject Ch

实现树型结构(二)

树型结构 实现树型结构(第二部分)作者:ACE      最后更新:06/08/2000      类别:原创 在上一部分,我们讨论了如何读取数据,并得到了表示层次关系的结果集.在这一部分,我们来看如何用脚本语言实现类似 MSDN 的界面. 可以在服务器端也可以在客户端完成这样的功能,这就要看需要了.在服务器端完成需要占用服务器的处理时间及相关资源,在客户端完成需要浏览器支持脚本语言(一般是 JavaScript),并要下载执行脚本. 在我们的示例里采用客户端执行脚本的方法. 1. 将数据发送到

.NET中C#实现C/S架构下的TREEVIEW只需要输入表名,父ID,节点ID,节点名就可以得到树型结构

treeview|架构|树型结构 调用时如下:         /// <param name="newTreeView">树型控件名称</param>        /// <param name="TreeViewName">一层的功能名称</param>        /// <param name="TableName">数据库中的表名</param>