Javascript 实现TreeView CheckBox全选效果


Posted in Javascript onJanuary 11, 2010
function OnTreeNodeChecked() { 
var ele = event.srcElement; 
if (ele.type == 'checkbox') { 
var childrenDivID = ele.id.replace('CheckBox', 'Nodes'); 
var div = document.getElementById(childrenDivID); 
if (div != null) { 
var checkBoxs = div.getElementsByTagName('INPUT'); 
for (var i = 0; i < checkBoxs.length; i++) { 
if (checkBoxs[i].type == 'checkbox') 
checkBoxs[i].checked = ele.checked; 
} 
} 
OnTreeNodeChildChecked(ele); } 
} 
function OnTreeNodeChildChecked(ele) { 
//自动处理上级 
var parentDiv = ele.parentElement.parentElement.parentElement.parentElement.parentElement; 
var parentChkBox = document.getElementById(parentDiv.id.replace('Nodes', 'CheckBox')); 
if (parentChkBox != null) { 
var ChildsChkAll = true; 
var Boxs = parentDiv.getElementsByTagName('INPUT'); 
for (var i = 0; i < Boxs.length; i++) { 
if (Boxs[i].type == 'checkbox' && Boxs[i].checked == false) { 
ChildsChkAll = false; 
} 
} 
parentChkBox.checked = ChildsChkAll; 
OnTreeNodeChildChecked(parentChkBox); 
} 
}

CS文件中注册JavaScript:

void Page_Load(object sender,EventArgs e) 
{ 
this.TreeView.Attribute.Add("onclick","OnTreeNodeChecked()"); 
}
Javascript 相关文章推荐
用javascript连接access数据库的方法
Nov 17 Javascript
js TextArea的选中区域处理
Dec 28 Javascript
jQuery EasyUI API 中文文档 - Calendar日历使用
Oct 19 Javascript
浅谈Jquery为元素绑定事件
Apr 27 Javascript
为何JS操作的href都是javascript:void(0);呢
Nov 12 Javascript
Bootstrap树形组件jqTree的简单封装
Jan 25 Javascript
vue.js学习笔记:如何加载本地json文件
Jan 17 Javascript
详解如何使用webpack+es6开发angular1.x
Aug 16 Javascript
用npm-run实现自动化任务的方法示例
Jan 14 Javascript
vue递归组件实战之简单树形控件实例代码
Aug 27 Javascript
JS回调函数简单易懂的入门实例分析
Sep 29 Javascript
vue调用微信JSDK 扫一扫,相册等需要注意的事项
Jan 03 Vue.js
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 #Javascript
JavaScript 学习笔记(九)call和apply方法
Jan 11 #Javascript
取选中的radio的值
Jan 11 #Javascript
javascript Object与Function使用
Jan 11 #Javascript
Extjs学习笔记之九 数据模型(上)
Jan 11 #Javascript
JavaScript 事件冒泡简介及应用
Jan 11 #Javascript
Javascript 读书笔记索引贴
Jan 11 #Javascript
You might like
PHP 开发工具
2006/12/06 PHP
使用php语句将数据库*.sql文件导入数据库
2014/05/05 PHP
Ubuntu下安装PHP的mongodb扩展操作命令
2015/07/04 PHP
PHP7新特性foreach 修改示例介绍
2016/08/26 PHP
[原创]图片分页查看
2006/08/28 Javascript
指定位置如果有图片显示图片,无图片显示广告的JS
2010/06/05 Javascript
解决jquery版本冲突的有效方法
2014/09/02 Javascript
深入学习AngularJS中数据的双向绑定机制
2016/03/04 Javascript
Bootstrap实现的经典栅格布局效果实例【附demo源码】
2017/03/30 Javascript
JavaScript实现微信号随机切换代码
2018/03/09 Javascript
Vue不能检测到Object/Array更新的情况的解决
2018/06/26 Javascript
vue.js通过路由实现经典的三栏布局实例代码
2018/07/08 Javascript
koa2使用ejs和nunjucks作为模板引擎的使用
2018/11/27 Javascript
详解vue中的computed的this指向问题
2018/12/05 Javascript
webpack-url-loader 解决项目中图片打包路径问题
2019/02/15 Javascript
JS document form表单元素操作完整示例
2020/01/13 Javascript
[47:45]Liquid vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
[01:52]2020年DOTA2 TI10夏季活动预告片
2020/07/15 DOTA
python概率计算器实例分析
2015/03/25 Python
Pycharm编辑器技巧之自动导入模块详解
2017/07/18 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
Python实现监控键盘鼠标操作示例【基于pyHook与pythoncom模块】
2018/09/04 Python
python装饰器相当于函数的调用方式
2019/12/27 Python
CSS3 绘制BMW logo实的现代码
2013/04/25 HTML / CSS
浅析HTML5中header标签的用法
2016/06/24 HTML / CSS
会计工作决心书
2014/03/11 职场文书
中国好声音华少广告词
2014/03/17 职场文书
股权收购意向书
2014/04/01 职场文书
学生夜不归宿检讨书
2014/09/23 职场文书
优秀教师推荐材料
2014/12/16 职场文书
2015年党员自评材料
2014/12/17 职场文书
小学教师求职信范文
2015/03/20 职场文书
2015年学校党支部工作总结
2015/04/01 职场文书
离职证明格式样本
2015/06/12 职场文书
大学生学习十八届五中全会精神心得体会
2016/01/05 职场文书
CentOS7安装MySQL8的超级详细教程(无坑!)
2022/06/10 Servers