js用于树型结构级联选择 支持三态级联选择
时间:2022-04-23
本文章向大家介绍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>
更新:支持三态级联选择
下载:/Files/boolean/checkbox3StatucCascadeSelectTree.zip
在线演示:/Files/boolean/cascadeTree.htm
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 原创 | 随机数大家都会用,但是你知道生成随机数的算法吗?
- 原创 | codeforces 1425E,一万种情况的简单题
- 原创 | codeforces 1417C,逆向思考的数据结构题
- 原创 | 操作失误不要慌,这个命令给你的Git一次反悔的机会
- 原创 | 想做推荐算法?先把FM模型搞懂再说
- 活见鬼,明明删除了数据,空间却没减少!
- 原创 | Git仓库的提交记录乱成一团,怎么办?
- 原创 | 平面内有N个点,如何快速求出距离最近的点对?
- 原创 | codeforces 1426F,初学者也能做,div3的最难题
- 安全研究 | YARA规则阻止Windows事件日志记录
- 研究人员如何使用Shhgit搜索GitHub中的敏感数据
- 使用nProbe监控移动网络(2G,3G和LTE)
- Mykings僵尸网络新变种已感染超5万台电脑
- 谁告诉你鸿蒙(HarmonyOS)不能在macOS下玩,一副没见过世面的样子!
- 连Python产生器(Generator)的原理都解释不了,还敢说Python用了5年?