还是树的问题，怎么就没人回复呢？别只说作过，共享一下，帮帮忙了！

合林元风 2003-01-03 05:41:05
生成一个节点有checkbox复选框的树，并且，点击父的checkbox，子的checkbox自动全选，点击子的checkbox，父节点的checkbox自动选中，如果子未全选，父节点成灰色状。
...全文
93 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
emu 2003-01-03
  • 打赏
  • 举报
 回复
稍做了点改动，把onclick从html中间挪出来了：

<HTML>
<HEAD>
<TITLE> emu's test of simple tree</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkSelect(){
var elm = event.srcElement;
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.checked=elm.checked;
checkChildrenRecurve(lis[i].firstChild)
}
}
function checkRootRecurve(ul){
if (ul.tagName != "UL") {
ul.parentNode.firstChild.allChecked = ul.parentNode.firstChild.checked;
ul.parentNode.firstChild.allUnChecked = !ul.parentNode.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.checked && lis[i].firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.checked && lis[i].firstChild.allUnChecked;
}
ul.parentNode.firstChild.allChecked=allChecked;
ul.parentNode.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked){
ul.parentNode.firstChild.checked=allChecked;
ul.parentNode.firstChild.style.backgroundColor="white";
}else{
ul.parentNode.firstChild.style.backgroundColor="gray";
ul.parentNode.firstChild.checked=true;

}
}

function init(){
var elms = document.getElementsByTagName("INPUT");
for (var i=0;i<elms.length;i++)
elms[i].onclick=checkSelect;
}
//-->
</SCRIPT>
</HEAD>

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


呼、呼，我要去歇会了……
emu 2003-01-03
  • 打赏
  • 举报
 回复
哇塞，一点都不容易写！
传统的树代码我就不在这里罗嗦了，主要演示一下递归判断父节点和子节点的状态：


<HTML>
<HEAD>
<TITLE> emu's test of simple tree</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function checkSelect(){
var elm = event.srcElement;
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.checked=elm.checked;
checkChildrenRecurve(lis[i].firstChild)
}
}
function checkRootRecurve(ul){
if (ul.tagName != "UL") {
ul.parentNode.firstChild.allChecked = ul.parentNode.firstChild.checked;
ul.parentNode.firstChild.allUnChecked = !ul.parentNode.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.checked && lis[i].firstChild.allChecked;
allUnChecked = allUnChecked && !lis[i].firstChild.checked && lis[i].firstChild.allUnChecked;
}
ul.parentNode.firstChild.allChecked=allChecked;
ul.parentNode.firstChild.allUnChecked=allUnChecked;
if (allChecked || allUnChecked){
ul.parentNode.firstChild.checked=allChecked;
ul.parentNode.firstChild.style.backgroundColor="white";
}else{
ul.parentNode.firstChild.style.backgroundColor="gray";
ul.parentNode.firstChild.checked=true;

}
}

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

<BODY>
<div>
<input type=checkbox onclick="checkSelect()">
<UL id=root>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<LI><input type=checkbox onclick="checkSelect()">
</UL>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<LI><input type=checkbox onclick="checkSelect()">
</UL>
</UL>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<LI><input type=checkbox onclick="checkSelect()">
</UL>
<LI><input type=checkbox onclick="checkSelect()">
<UL>
<LI><input type=checkbox onclick="checkSelect()">
<LI><input type=checkbox onclick="checkSelect()">
</UL>
</UL>
</UL>
</div>
</BODY>
</HTML>
zdsxj2002 2003-01-03
  • 打赏
  • 举报
 回复
我只能说我的想法，
在每一次改事件中，检查所有元素，然后写checkbox的状态。
风火编程--繁体转简体
繁体转简体 依赖文件 代码 from langconv import Converter f = &amp;quot;臺灣的額同胞們&amp;quot; # f转简体 j = Converter('zh-hans').convert(f) # j转繁体 f = Converter('zh-hans').convert(j) print(j) print(f) ...
好文章，共享！
转自：清茗轩论坛1.误会 : 早年在美国阿拉斯加地方，有一对年轻人结婚，婚後生育，他的太太因难产而死，遗下一孩子。他忙生活，又忙於看家，因没有人帮忙看孩子，就训练一只狗，那狗聪明听话，能照顾小孩，咬著奶瓶喂奶给孩子喝，抚养孩子。 有一天，主人出门去了，叫它照顾孩子。 他到了别的乡村，因遇大雪，当日不能回来。第二天才赶回家，狗立即闻声出来迎接主人。他把房门开一看，到处是血，抬头一望，床上也是血，孩子
《创始人行动指南手册》创业迷局破解：为什么有人3年上市，有人20年还在原地踏步？
原创 胡华成 创服家 2025年04月24日 10:48 江苏各位创始人会员朋友，咱们掏心窝子聊一聊！我是智和岛集团的胡华成，同时也是投融湾和创服家的创始人。在创业圈摸爬滚打这些年，最常被问到的问题就是：“您这三家公司到底是干啥的？能帮我们解决啥难题？”这么说吧，这三家公司就像给创业路上的你量身定制的“黄金搭档”。创服家是创业萌新的“领路人”，专门服务营收500万 - 5000万的早期公司。想象一下，你刚拿到创业地图，却连东南西北都分不清，创服家就是那个拽着你手把手教你认路的人。我们从商业模式打磨到发展路径
中台的问题，是技术的问题，还是人的问题
点击“技术领导力”关注∆每天早上8:30推送转载自|技术琐话风乍起，吹皱一池春水前一阵“中台，我信了你的邪”刷爆了朋友圈，以 36氪的影响和富于讲故事的叙述，让很多做过或者没做过中...
"淘宝开放平台"可以成为程序员的摇钱树吗？
“少壮不努力，长大作IT” 既然已经作了IT人，那也不是没有发财的道。 有很多写共享软件发财的，当然，那得主要卖欧美市场的，国内似乎不太行。 有写iPhone应用（如：多彩水族馆），1月入千万的。 还有作网站赚GG AD的。 看多了别人的发财故事，也鼓捣过，想自己也发点小财，于是乎，作GGAD，google app engine，淘客，Android应用，还
JavaScript

87,996

社区成员

224,693

社区内容

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

加载中

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

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

+ 用AI写文章