checkbox权限树
html代码
<html>
<head>
<title>dtree</title>
<link rel="StyleSheet" href="dtree.css" type="text/css" />
<script type="text/javascript" src="dtree.js"></script>
</head>
<body>
<div class="dtree">
<p><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p>
<script type="text/javascript">
<!--
d = new dTree('d');
d.add(0,-1,'菜单权限树');
d.add(1,0,'authority','25','一级菜单1 ');
d.add(2,1,'authority','26','二级菜单1 ');
d.add(3,2,'authority','27','三级菜单1 ');
d.add(4,2,'authority','28','三级菜单2 ');
d.add(32,3,'authority','26','二级菜单1 ');
d.add(33,32,'authority','27','用户管理 ');
d.add(34,32,'authority','28','用户组管理 ');
d.add(22,1,'authority','26','二级菜单1 ');
d.add(23,22,'authority','27','用户管理 ');
d.add(24,22,'authority','28','用户组管理 ');
d.add(6,0,'authority','25','一级菜单2 ',true,true);
d.add(7,6,'authority','26','二级菜单2 ',true,true);
d.add(8,7,'authority','27','用户管理 ',true,true);
d.add(9,7,'authority','28','用户组管理 ',true,true);
d.add(11,0,'authority','25','一级菜单3 ');
d.add(12,11,'authority','26','二级菜单3 ');
d.add(13,12,'authority','27','用户管理 ');
d.add(14,12,'authority','27','用户组管理 ');
document.write(d);
d.openAll();
//-->
</script>
</div>
<div>
<input type='button' name='bTest' value='test' onclick='test();'>
</div>
</body>
<script type="text/javascript">
<!--
function test(){
var count = 0;
var obj = document.all.authority;
for(i=0;i<obj.length;i++){
if(obj[i].checked){
alert(obj[i].value);
count ++;
}
}
}
//-->
</script>
</html>
dtree.js 关键代码
Node这个方法 里解释了 各个参数的含义
function Node(id, pid, cname, cvalue, cshow, cchecked, cdisabled, url, title, target, icon, iconOpen, open) {
this.id = id;
this.pid = pid;
//chechbox的名称
this.cname = cname;
//chechbox的值
this.cvalue = cvalue;
//chechbox的显示
this.cshow = cshow;
//chechbox是否被选中,默认是不选
this.cchecked = cchecked||false;
//chechbox是否可用,默认是可用
this.cdisabled = cdisabled||false;
//节点链接,默认是虚链接
this.url = url||'#';
this.title = title;
this.target = target;
this.icon = icon;
this.iconOpen = iconOpen;
this._io = open || false;
this._is = false;
this._ls = false;
this._hc = false;
this._ai = 0;
this._p;
};
具体的使用可以下载附件查看代码.......反正挺简单的....
- 大小: 26.7 KB
分享到:
相关推荐
【标题】"ZTree+Struts2+ajax+json实现checkbox权限树"涉及的技术栈主要集中在前端的ZTree,后端的Struts2框架,以及数据交互中的Ajax和JSON。这个项目的核心目标是构建一个可复选的权限树形结构,用户通过勾选节点...
"带checkbox的dtree权限树"是一种常见的实现方式,它结合了数据树(dtree)与复选框(checkbox)功能,用于展示层级关系的权限结构。这种权限树常用于角色分配、用户权限设置以及权限级别的可视化管理。 1. **dtree...
在IT领域,尤其是在前端开发中,"带有checkbox的权限树"是一种常见的用户界面设计,用于管理复杂的层级结构数据,如组织架构、权限分配等。这种设计通常涉及到jQuery库和树形插件,如本例中的`jquery-treeview`。...
在实际应用中,Checkbox Tree常用于配置页面,例如在权限管理、目录结构选择、软件功能模块开关等场景。开发者可以利用各种前端框架或库(如React、Vue、Angular等)实现Checkbox Tree,例如在JavaScript中,有一些...
jQuery_treetable实现checkbox树,实现多级联动,适用于权限树等各类需要树形结构数据的场景
在IT领域,尤其是在前端开发中,"checkbox树"是一种常见的用户界面组件,它结合了复选框(checkbox)和树形结构,用于展示层级关系的数据,并允许用户进行多级选择。这种组件在诸如文件管理器、组织架构选择、权限...
**zTree 3.5 Radio/Checkbox 自定义树形组件详解** zTree 是一款基于 jQuery 的强大树形插件,广泛应用于网页中的数据展示、菜单导航等场景。在 zTree 3.5 版本中,它提供了丰富的功能,包括单选(Radio)和复选...
本文将详细讲解如何利用jQuery创建一个带有CheckBox的树形结构,这在许多项目中,如网站导航、数据管理或权限设置等场景都非常实用。 首先,我们需要了解jQuery生成树的基本原理。jQuery树形插件通常是通过遍历数据...
本示例“wicket组织树带checkbox可逐层加载数据”聚焦于如何利用Wicket实现一个具备层级结构、带有复选框(checkbox)的树形视图,并支持按需动态加载数据。 首先,我们要理解“组织树”。在Web应用中,组织树通常...
在描述中提到的“带CheckBox的权限树”,通常指的是树形结构的导航元素,每个节点都可以被勾选或取消,表示用户对特定资源的访问权限。这种树形结构常用于权限分配或角色管理的界面,使得管理员能够直观地设定哪些...
"js树,带checkBox"特指在JavaScript实现的树结构中,节点具有复选框功能,允许用户进行多选操作。这种功能在很多应用场景中都非常实用,比如在设置权限、选择项集合时。 在JavaScript中实现这样的树形结构,通常会...
本工程使用dTree组件实现树形菜单的展示 有静态树形菜单和动态(从数据库获取数据)树形菜单展示两种 ...菜单既有普通的树结构展示,也有方便做权限等功能的带选择框的展示(含带默认选中checkbox的处理)
这些是前段时间做项目时候找到工具,感觉挺好用的dtree是编写菜单用的,AuthorityTree是改写后的dtree,增加了checkbox,可以用来做权限分配,treecheckbox还没来的及研究,感觉功能挺不错的。感觉以后肯定用得上。...
实现树形菜单的CheckBox级联选择功能是增强用户交互性的重要手段,它允许用户通过选择一个节点来自动选中或取消选中其所有子节点,以及可能的父节点。这个特性通常在多级选择场景中非常有用。 首先,我们要理解`...
"jstree_checkbox"是一个专门用于创建具有复选框功能的权限树结构的JavaScript库。在Web开发中,这样的工具非常实用,特别是在处理用户角色、权限分配或组织结构等需要多级选择和层级关系的场景。它允许用户通过交互...
"树形菜单带checkbox"则是在这种菜单的基础上添加了复选框(checkbox)功能,允许用户进行多选操作,如全选、反选、选择特定节点等,极大地提升了用户的交互体验。 在Web开发中,实现树形菜单带checkbox通常涉及到...
总结,带checkBox的treeView是用户界面设计中的一个重要工具,它通过树状结构清晰地展示了层次数据,并通过复选框赋予用户选择权限。开发者需要掌握如何创建和管理这种控件,包括处理事件、存储和恢复状态等,以提供...
在实际应用中,"JS权限树"常常用于权限管理系统,通过树状结构展示不同的角色和它们对应的权限。用户可以根据需要勾选或取消复选框,系统会根据用户的操作更新权限配置。这样的设计既直观又高效,大大简化了权限分配...
3. 权限绑定:将用户角色与目录树的节点进行关联,根据数据库中记录的权限状态,设置节点的checkbox状态。这一步可能需要编写VBScript或JavaScript代码来实现。 4. 事件处理:当用户更改节点的checkbox状态时,捕获...