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中的Split使用方法与技巧
Mar 09 Javascript
Mootools 1.2教程 定时器和哈希简介
Sep 15 Javascript
javaScript 删除字符串空格多种方法小结
Oct 24 Javascript
引入JS文件IE6报语法错误或缺少对象问题的解决方法
Jan 09 Javascript
Bootstrap中定制LESS-颜色及导航条(推荐)
Nov 21 Javascript
vue中用H5实现文件上传的方法实例代码
May 27 Javascript
JavaScript hasOwnProperty() 函数实例详解
Aug 04 Javascript
ES6学习教程之模板字符串详解
Oct 09 Javascript
Node.Js生成比特币地址代码解析
Apr 21 Javascript
在vue中使用express-mock搭建mock服务的方法
Nov 07 Javascript
layui表格内容溢出的解决方法
Sep 06 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
Jan 18 Javascript
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
yii数据库的查询方法
2015/12/28 PHP
php爬取天猫和淘宝商品数据
2018/02/23 PHP
PHP结合Ffmpeg快速搭建流媒体服务的实践记录
2018/10/31 PHP
php+lottery.js实现九宫格抽奖功能
2019/07/21 PHP
javascript获取form里的表单元素的示例代码
2014/02/14 Javascript
javascript学习笔记(七)Ajax和Http状态码
2014/10/08 Javascript
js中this的用法实例分析
2015/01/10 Javascript
js实现点击图片将图片地址复制到粘贴板的方法
2015/02/16 Javascript
AngularJS基础教程之简单介绍
2015/09/27 Javascript
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
2016/08/05 Javascript
微信小程序 触控事件详细介绍
2016/10/17 Javascript
浅谈html转义及防止javascript注入攻击的方法
2016/12/04 Javascript
浅谈JavaScript的闭包函数
2016/12/08 Javascript
JS实现动态修改table及合并单元格的方法示例
2017/02/20 Javascript
jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
2017/03/24 jQuery
vue.js 初体验之Chrome 插件开发实录
2017/05/13 Javascript
微信小程序tabbar不显示解决办法
2017/06/08 Javascript
微信小程序 sha1 实现密码加密实例详解
2017/07/06 Javascript
基于vue v-for 多层循环嵌套获取行数的方法
2018/09/26 Javascript
零基础之Node.js搭建API服务器的详解
2019/03/08 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
Vue事件修饰符native、self示例详解
2019/07/09 Javascript
解决layui的radio属性或别的属性没显示出来的问题
2019/09/26 Javascript
js 闭包深入理解与实例分析
2020/03/19 Javascript
vue使用vant中的checkbox实现全选功能
2020/11/17 Vue.js
Python利用pyHook实现监听用户鼠标与键盘事件
2014/08/21 Python
在Python中操作时间之tzset()方法的使用教程
2015/05/22 Python
Django分页查询并返回jsons数据(中文乱码解决方法)
2018/08/02 Python
Python中浅拷贝copy与深拷贝deepcopy的简单理解
2018/10/26 Python
pytorch:实现简单的GAN示例(MNIST数据集)
2020/01/10 Python
python中使用asyncio实现异步IO实例分析
2021/02/26 Python
如何反序的迭代一个序列?how do I iterate over a sequence in reverse order
2012/02/04 面试题
2014新课程改革心得体会
2014/03/10 职场文书
市场营销专业毕业生求职信
2014/07/21 职场文书
反对四风自我剖析材料
2014/10/07 职场文书
Python数据可视化之绘制柱状图和条形图
2021/05/25 Python