求带Check框的树的源代码

dreammaster 2003-02-20 01:07:30
请各位大侠帮忙, 分不够可再开.
...全文
51 20 打赏 收藏 转发到动态 举报
写回复
用AI写文章
20 条回复
切换为时间正序
请发表友善的回复…
发表回复
dreammaster 2003-03-18
  • 打赏
  • 举报
 回复
效果很好,但就是每一次Load花太多时间
emu 2003-03-17
  • 打赏
  • 举报
 回复
不错，不过checkbox和radio的虚线框的隐现效果好像有问题，IE5.0。有可能是浏览器本身的问题。
孟子E章 2003-03-16
  • 打赏
  • 举报
 回复
http://ps.luohuedu.net/sg5s/

欢迎提宝贵意见
shanxing 2003-03-13
  • 打赏
  • 举报
 回复
<HTML>
<HEAD>
<TITLE> emu's test of simple tree</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkSelect(){
var elm = event.srcElement.parentNode;
checkChildrenRecurve(elm);
checkRootRecurve(document.getElementById("root"));
}
function checkChildrenRecurve(elm){
var li = elm.parentNode;
var ul = li.lastChild;
if (ul.tagName != "UL") return;
var lis = ul.children;
for (var i=0;i<lis.length;i++){
lis[i].firstChild.firstChild.checked=elm.firstChild.checked;
checkChildrenRecurve(lis[i].firstChild)
}
}
function checkRootRecurve(ul){
if (ul.tagName != "UL") {
ul.parentNode.firstChild.firstChild.allChecked = ul.parentNode.firstChild.firstChild.checked;
ul.parentNode.firstChild.firstChild.allUnChecked = !ul.parentNode.firstChild.firstChild.checked;
return;
}
var lis = ul.children;
var allChecked = true;
var allUnChecked = true;
for (var i=0;i<lis.length;i++){
checkRootRecurve(lis[i].lastChild);
allChecked = allChecked && lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allUnChecked;
}
ul.parentNode.firstChild.firstChild.allChecked=allChecked;
ul.parentNode.firstChild.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked){
ul.parentNode.firstChild.firstChild.checked=allChecked;
ul.parentNode.firstChild.firstChild.disabled=false;
ul.parentNode.firstChild.childStatus=false;
}else{
ul.parentNode.firstChild.firstChild.disabled=true;
ul.parentNode.firstChild.childStatus=true;
ul.parentNode.firstChild.firstChild.checked=true;

}
}

function enableFirstChild(){
this.childStatus = this.firstChild.disabled;
this.firstChild.disabled=false;
}
function recoverFirstChild(){
this.firstChild.disabled = this.childStatus;
}
function init(){
var elms = document.getElementsByTagName("INPUT");
for (var i=0;i<elms.length;i++)
elms[i].onclick=checkSelect;
var elms = document.getElementsByTagName("SPAN");
for (var i=0;i<elms.length;i++){
elms[i].onmouseover=enableFirstChild;
elms[i].onmouseout=recoverFirstChild;
}
}

//-->
</SCRIPT>
</HEAD>

<BODY onload="init()">
<div>
<span><input type=checkbox></span>
<UL id=root>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
</UL>
</div>
</BODY>
</HTML>



这样还简单~~~~
emu_ston 2003-03-13
  • 打赏
  • 举报
 回复
嘻嘻，想同了原理就很简单。那些烦琐的树代码我都没有放进来。
emu_ston 2003-03-12
  • 打赏
  • 举报
 回复
孟子你在哪里啊？
emu 2003-03-07
  • 打赏
  • 举报
 回复
孟子孟子！
emu_ston 2003-03-05
  • 打赏
  • 举报
 回复
发了吗？怎么结帖了？
dreammaster 2003-02-25
  • 打赏
  • 举报
 回复
加油!!!!
emu 2003-02-25
  • 打赏
  • 举报
 回复
呵呵，两天过来up一次，他敢不发烦都烦死他 :))
dreammaster 2003-02-23
  • 打赏
  • 举报
 回复
等待中...............................
孟子E章 2003-02-23
  • 打赏
  • 举报
 回复
现在在整理，过几天就发
emu 2003-02-22
  • 打赏
  • 举报
 回复
孟子，你的文档什么时候发？
emu_ston 2003-02-21
  • 打赏
  • 举报
 回复
我写了个简单的，抛砖引玉吧：

<HTML>
<HEAD>
<TITLE> emu's test of simple tree</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkSelect(){
var elm = event.srcElement.parentNode;
checkChildrenRecurve(elm);
checkRootRecurve(document.getElementById("root"));
}
function checkChildrenRecurve(elm){
var li = elm.parentNode;
var ul = li.lastChild;
if (ul.tagName != "UL") return;
var lis = ul.children;
for (var i=0;i<lis.length;i++){
lis[i].firstChild.firstChild.checked=elm.firstChild.checked;
checkChildrenRecurve(lis[i].firstChild)
}
}
function checkRootRecurve(ul){
if (ul.tagName != "UL") {
ul.parentNode.firstChild.firstChild.allChecked = ul.parentNode.firstChild.firstChild.checked;
ul.parentNode.firstChild.firstChild.allUnChecked = !ul.parentNode.firstChild.firstChild.checked;
return;
}
var lis = ul.children;
var allChecked = true;
var allUnChecked = true;
for (var i=0;i<lis.length;i++){
checkRootRecurve(lis[i].lastChild);
allChecked = allChecked && lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allUnChecked;
}
ul.parentNode.firstChild.firstChild.allChecked=allChecked;
ul.parentNode.firstChild.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked){
ul.parentNode.firstChild.firstChild.checked=allChecked;
ul.parentNode.firstChild.firstChild.disabled=false;
}else{
ul.parentNode.firstChild.firstChild.disabled=true;
ul.parentNode.firstChild.firstChild.checked=true;

}
}

function enableFirstChild(){
this.childStatus = this.firstChild.disabled;
this.firstChild.disabled=false;
}
function recoverFirstChild(){
this.firstChild.disabled = this.childStatus;
}
function init(){
var elms = document.getElementsByTagName("INPUT");
for (var i=0;i<elms.length;i++)
elms[i].onclick=checkSelect;
var elms = document.getElementsByTagName("SPAN");
for (var i=0;i<elms.length;i++){
elms[i].onmouseover=enableFirstChild;
elms[i].onmouseout=recoverFirstChild;
}
}

//-->
</SCRIPT>
</HEAD>

<BODY onload="init()">
<div>
<span><input type=checkbox></span>
<UL id=root>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
</UL>
</div>
</BODY>
</HTML>
emu 2003-02-21
  • 打赏
  • 举报
 回复
看起来效果是反向的，其实实际计算是顺向的呵呵，为了计算一个节点的状态要遍历计算所有子节点的状态。
这样做可能效率低了一定，但是代码就好写的多了。
dreammaster 2003-02-21
  • 打赏
  • 举报
 回复
多谢emu,感觉您的tree中check框的反向递归选中很有创意。
烂笔头Danky 2003-02-21
  • 打赏
  • 举报
 回复
虽然你说是简单，但我觉得是非常值得参考的！
emu_ston 2003-02-21
  • 打赏
  • 举报
 回复
呵呵，刚贴出来就发现一个bug，改了一下：

<HTML>
<HEAD>
<TITLE> emu's test of simple tree</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkSelect(){
var elm = event.srcElement.parentNode;
checkChildrenRecurve(elm);
checkRootRecurve(document.getElementById("root"));
}
function checkChildrenRecurve(elm){
var li = elm.parentNode;
var ul = li.lastChild;
if (ul.tagName != "UL") return;
var lis = ul.children;
for (var i=0;i<lis.length;i++){
lis[i].firstChild.firstChild.checked=elm.firstChild.checked;
checkChildrenRecurve(lis[i].firstChild)
}
}
function checkRootRecurve(ul){
if (ul.tagName != "UL") {
ul.parentNode.firstChild.firstChild.allChecked = ul.parentNode.firstChild.firstChild.checked;
ul.parentNode.firstChild.firstChild.allUnChecked = !ul.parentNode.firstChild.firstChild.checked;
return;
}
var lis = ul.children;
var allChecked = true;
var allUnChecked = true;
for (var i=0;i<lis.length;i++){
checkRootRecurve(lis[i].lastChild);
allChecked = allChecked && lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.firstChild.checked && lis[i].firstChild.firstChild.allUnChecked;
}
ul.parentNode.firstChild.firstChild.allChecked=allChecked;
ul.parentNode.firstChild.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked){
ul.parentNode.firstChild.firstChild.checked=allChecked;
ul.parentNode.firstChild.firstChild.disabled=false;
ul.parentNode.firstChild.childStatus=false;
}else{
ul.parentNode.firstChild.firstChild.disabled=true;
ul.parentNode.firstChild.childStatus=true;
ul.parentNode.firstChild.firstChild.checked=true;

}
}

function enableFirstChild(){
this.childStatus = this.firstChild.disabled;
this.firstChild.disabled=false;
}
function recoverFirstChild(){
this.firstChild.disabled = this.childStatus;
}
function init(){
var elms = document.getElementsByTagName("INPUT");
for (var i=0;i<elms.length;i++)
elms[i].onclick=checkSelect;
var elms = document.getElementsByTagName("SPAN");
for (var i=0;i<elms.length;i++){
elms[i].onmouseover=enableFirstChild;
elms[i].onmouseout=recoverFirstChild;
}
}

//-->
</SCRIPT>
</HEAD>

<BODY onload="init()">
<div>
<span><input type=checkbox></span>
<UL id=root>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
<LI><span><input type=checkbox></span>
<UL>
<LI><span><input type=checkbox></span>
<LI><span><input type=checkbox></span>
</UL>
</UL>
</UL>
</div>
</BODY>
</HTML>
emu 2003-02-20
  • 打赏
  • 举报
 回复
呵呵，带不带递归选中子节点，递归选中（半选中）父节点的？
期待中......
孟子E章 2003-02-20
  • 打赏
  • 举报
 回复
我写了一个，不过代码很多，有时间我发表文档
android源代码目录树说明
Android 2.1 |-- Makefile |-- bionic （bionic C库） |-- bootable （启动引导相关代码） |-- build （存放系统编译规则及generic等基础开发包配置） |-- cts （Android兼容性测试套件标准） |-- dalvik （dalvik JAVA虚拟机） |-- development （应用程序开发相关） |-- exter
使用带复选框的CheckBoxTree树组件
在使用Java Swing开发UI程序时，很有可能会遇到使用带复选框的树的需求，但是Java Swing并没有提供这个组件，因此如果你有这个需求，你就得自己动手实现带复选框的树。 CheckBoxTree与JTree在两个层面上存在差异： 1.在模型层上，CheckBoxTree的每个结点需要一个成员来保存其是否被选中，但是JTree的结点则不需要。 2.在视图层上，
一个简单的带复选框的树形图
<body> <ul> <li class="li" > <label><input type="checkbox" checked="true" class="check-father" /><span id=""> adadadadsa </span></label> <ul class="child"> <li> .
Java中带复选框的树（Java CheckBox Tree）的实现和应用
在使用Java Swing开发UI程序时，很有可能会遇到使用带复选框的树的需求，但是Java Swing并没有提供这个组件，因此如果你有这个需求，你就得自己动手实现带复选框的树。 CheckBoxTree与JTree在两个层面上存在差异： 在模型层上，CheckBoxTree的每个结点需要一个成员来保存其是否被选中，但是JTree的结点则不需要。在视图层上，CheckBoxTree的每
Cppcheck（C/C++ 静态代码检测工具）
Cppcheck是一个用于C/C++代码的静态分析工具，它可以帮助开发者检测代码中的错误。Cppcheck可以检测出许多类型的错误，包括语法错误、未使用的函数、内存泄漏、未初始化的变量等。此外，Cppcheck还支持用户自定义规则，这使得开发者可以根据自己的需求定制Cppcheck的行为。
JavaScript

87,996

社区成员

224,693

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章