zoukankan
html css js c++ java
用JS实现VS2005 TreeView的checkBox的父子节点级联取自YYControls
项目中需要实现树的父子节点级联功能,所以想到了YYControls控件,但是又不好直接使用这个控件,所以就把里面的代码直接提取出来了,在此也感谢YYControls的作者!
注:只
适
用于VS2005的TreeView控件
<
SCRIPT LANGUAGE
=
"
JavaScript
"
>
<!--
//
调用方法:
//
在页面文件中使用下面语句将树名添加到yy_stv_ccTreeView_pre数组中:
//
参数中的'menuTreename'即为树名称
yy_stv_ccTreeView_pre.push(
"
menuTreename
"
);
//
-->
<
/
SCRIPT>
核心JS代码
//
将以下代码另存为JS文件,直接加载在目标文件中即可
/**/
/*
Helper 开始
*/
String.prototype.yy_stv_startsWith
=
function
(s)
{
//
/ <summary>StartsWith()</summary>
var
reg
=
new
RegExp(
"
^
"
+
s);
return
reg.test(
this
);
}
function
yy_stv_addEvent(obj, evtType, fn)
{
//
/ <summary>绑定事件</summary>
//
FF
if
(obj.addEventListener)
{
obj.addEventListener(evtType, fn,
true
);
return
true
;
}
//
IE
else
if
(obj.attachEvent)
{
var
r
=
obj.attachEvent(
"
on
"
+
evtType, fn);
return
r;
}
else
{
return
false
;
}
}
/**/
/*
Helper 结束
*/
/**/
/*
联动复选框 开始
*/
var
yy_stv_ccTreeView_pre
=
new
Array();
//
cs中动态向其灌数据(TreeView内控件ID的前缀数组)
function
yy_stv_ccClickCheckbox(e)
{
//
/ <summary>单击复选框时</summary>
var
evt
=
e
||
window.event;
//
FF || IE
var
obj
=
evt.target
||
evt.srcElement
//
FF || IE
yy_stv_foreachChildCheckbox(obj);
yy_stv_foreachParentCheckbox(obj);
}
function
yy_stv_checkParentCheckbox(table, checked)
{
//
/ <summary>设置父复选框的状态</summary>
var
nodes
=
table.parentNode.parentNode.childNodes;
for
(
var
i
=
1
; i
<
nodes.length; i
++
)
{
if
(nodes[i]
==
table.parentNode)
{
if
(
typeof
(nodes[i
-
1
])
==
'
undefined
'
||
typeof
(nodes[i
-
1
].rows)
==
'
undefined
'
)
return
;
for
(
var
x
=
0
; x
<
nodes[i
-
1
].rows.length; x
++
)
{
for
(
var
j
=
0
; j
<
nodes[i
-
1
].rows[x].cells.length; j
++
)
{
//
debugger;
var
chk
=
nodes[i
-
1
].rows[x].cells[j].childNodes[
0
];
if
(
typeof
(chk)
!=
'
undefined
'
&&
chk.tagName
==
"
INPUT
"
&&
chk.type
==
"
checkbox
"
)
{
chk.checked
=
checked;
yy_stv_foreachParentCheckbox(nodes[i
-
1
]);
return
;
}
}
}
}
}
}
function
yy_stv_foreachChildCheckbox(obj)
{
//
/ <summary>单击父复选框时,设置其子复选框的选中状态</summary>
var
checked;
if
(obj.tagName
==
"
INPUT
"
&&
obj.type
==
"
checkbox
"
)
{
checked
=
obj.checked;
do
{
obj
=
obj.parentNode;
}
while
(obj.tagName
!=
"
TABLE
"
)
}
var
nodes
=
obj.parentNode.childNodes;
for
(
var
i
=
0
; i
<
nodes.length
-
1
; i
++
)
{
if
(nodes[i]
==
obj
&&
nodes[i
+
1
].tagName
==
"
DIV
"
)
{
var
elements
=
nodes[i
+
1
].getElementsByTagName(
"
INPUT
"
);
for
(j
=
0
; j
<
elements.length; j
++
)
{
if
(elements[j].type
==
'
checkbox
'
)
{
elements[j].checked
=
checked;
}
}
}
}
}
function
yy_stv_foreachParentCheckbox(obj)
{
//
/ <summary>单击某一复选框时,设置其父复选框的选中状态</summary>
var
checkedNum
=
0
;
var
uncheckedNum
=
0
;
if
(obj.tagName
==
"
INPUT
"
&&
obj.type
==
"
checkbox
"
)
{
do
{
obj
=
obj.parentNode;
}
while
(obj.tagName
!=
"
TABLE
"
)
}
var
tables
=
obj.parentNode.getElementsByTagName(
"
TABLE
"
);
if
(
typeof
(tables)
==
'
undefined
'
)
return
;
for
(
var
i
=
0
; i
<
tables.length; i
++
)
{
for
(
var
x
=
0
; x
<
tables[i].rows.length; x
++
)
{
for
(
var
j
=
0
; j
<
tables[i].rows[x].cells.length; j
++
)
{
var
chk
=
tables[i].rows[x].cells[j].childNodes[
0
];
if
(
typeof
(chk)
!=
'
undefined
'
&&
chk.tagName
==
"
INPUT
"
&&
chk.type
==
"
checkbox
"
)
{
if
(chk.checked)
checkedNum
++
;
else
uncheckedNum
++
;
}
}
}
}
if
(uncheckedNum
==
0
)
{
yy_stv_checkParentCheckbox(obj,
true
);
}
else
{
yy_stv_checkParentCheckbox(obj,
false
);
}
}
function
yy_stv_attachCheckboxClickListener()
{
//
/ <summary>监听所有联动复选框的单击事件</summary>
var
elements
=
document.getElementsByTagName(
"
INPUT
"
);
for
(i
=
0
; i
<
elements.length; i
++
)
{
if
(elements[i].type
==
'
checkbox
'
)
{
for
(j
=
0
; j
<
yy_stv_ccTreeView_pre.length; j
++
)
{
if
(elements[i].id.yy_stv_startsWith(yy_stv_ccTreeView_pre[j]))
{
yy_stv_addEvent(elements[i],
'
click
'
, yy_stv_ccClickCheckbox);
break
;
}
}
}
}
}
if
(document.all)
{
window.attachEvent(
'
onload
'
, yy_stv_attachCheckboxClickListener);
}
else
{
window.addEventListener(
'
load
'
, yy_stv_attachCheckboxClickListener,
false
);
}
/**/
/*
联动复选框 结束
*/
查看全文
相关阅读:
python项目文件夹
内置函数
函数的递归
python入门之模块
匿名函数
生成器表达式
三元表达式
列表生成式
input相关问题总结
表单验证
原文地址:https://www.cnblogs.com/toumh/p/1077358.html
最新文章
jQuery Ajax实现下拉框无刷新联动
ASP.NET MVC PartialView用法
百度地图API实现地图定位
SQLite中文排序
自己编写的表单验证插件
EasyUI的datagrid分页
无刷新提交表单(非Ajax实现)
spring注解
JSTL标签库
修改UI中的值,无反应解决办法
热门文章
easyui获取一行数据和修改data-options的值
easyui菜单栏的使用
鼠标跟踪事件
java中printprintlnprintf的区别
oracle创建用户,修改用户,删除用户等关于用户的
水晶报表1
aspx返回json数据
WML标签速查手册 wap标签
datatime模块
time模块
Copyright © 2011-2022 走看看