JS TreeView实现复选框联动
来源:互联网 发布:飞象大数据分析平台 编辑:程序博客网 时间:2024/05/18 09:13
<script language="javascript" type="text/javascript">
function window.onload() {
document.getElementById("TreeView1").onclick = OnTreeNodeChecked;//这里把TreeView名改一下~
}
function OnTreeNodeChecked() {
var ele = event.srcElement;
if(ele.type=='checkbox') {
ele.className = "";
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;
}
}
setParentClassName(ele);
}
}
function setParentClassName(currCheckBox) {
var objParentNode= public_GetParentNode(currCheckBox);
if(public_IsObjectNull(objParentNode))
return;
var checkBoxs = objParentNode.getElementsByTagName("INPUT");
var allSelect = true;
var allUnSelect = true;
for(var i=0;i<checkBoxs.length;i++) {
if(checkBoxs[i].type=='checkbox')
{
if(checkBoxs[i].checked) allUnSelect = false;
else allSelect = false;
if((!allSelect) && (!allUnSelect))
break;
}
}
var objParentCheckBox = public_Node2CheckBox(objParentNode);
if(public_IsObjectNull(objParentCheckBox)) return;
setParentClassName(objParentCheckBox);
if(allSelect) {
objParentCheckBox.className = "";
objParentCheckBox.checked = true;
return;
}
if(allUnSelect) {
objParentCheckBox.className = "";
objParentCheckBox.checked = false;
return;
}
objParentCheckBox.checked = false;
objParentCheckBox.className = "parentbox_style";
}
//得到本节点所在的Node(Div对象)
function public_GetParentNode(element) {
var parent = element.parentNode;
var upperTagName = "DIV";
//如果这个元素还不是想要的tag就继续上溯
while (parent && (parent.tagName.toUpperCase() != upperTagName)) {
parent = parent.parentNode ? parent.parentNode : parent.parentElement;
}
return parent;
}
function public_Node2CheckBox(element) {
var objID = element.getAttribute("ID");
objID = objID.substring(0,objID.indexOf("Nodes"));
return document.getElementById(objID+"CheckBox");
}
function public_IsObjectNull(element) {
if(element==null || element == "undefined")
return true;
else
return false;
}
</script>
- JS TreeView实现复选框联动
- JS实现TreeView联动选中
- jquery实现复选框联动
- 为TreeView添加复选框 以及复选框的联动....吐血奉献 虽然不是原创
- 扩展TreeView控件(1) - 联动复选框(复选框的全选和取消全选)
- 扩展TreeView控件(1) - 联动复选框(复选框的全选和取消全选)
- TreeView复选框
- js实现选中复选框
- 【JS】复选框实现效果
- 动态生成TreeView并实现单击选中复选框同时实现复选框单选
- TreeView单击选中复选框
- 关于treeview控件复选框
- 给TreeView添加复选框
- 三态复选框的TreeView
- 给 treeview 加上复选框
- TreeView复选框选择 __JS
- 实现TreeView父子节点的联动
- 用js实现复选框全选
- 程序员需要有多懒 ?- cocos2d-x 数学函数、常用宏粗整理 - by Glede
- Xcode磁盘空间大清理
- ORACLE ORA-02030: can only select from fixed tables/views
- 《腾云-云计算和大数据时代网络技术揭秘》的收获与分享
- mysql更改了数据库存储路径后,出现错误1067 进程意外终止
- JS TreeView实现复选框联动
- (转) linux socket 编程(C语言)
- 菜鸟学SSH(七)——Spring jar包详解
- ORACLE MERGE INTO用法
- GBDT(MART) 迭代决策树入门教程 | 简介
- jbpm5 概述
- 通过纯RGB数据流生成Bitmap对象
- v$sysstat视图监控oracle性能
- V4L2 API详解 <三> Buffer的准备和数据读取