zhangchunlei老兄进来拿分，见者有份

cayyr 2001-11-18 09:00:50
zhangchunlei老兄 好
在你的一文中谈到如下内容，我也碰到同样问题，不知道你能否给我点提示
帮忙帮忙，头已经大了。 我都快把把互联网都快翻遍了 ：（
email:cayyr@sina.com 希望得到你的答复

如何实现树形结构中各节点（用核选框表示）彼此关联？
一树形结构：

root
¦-c1
¦-c10
¦-c11
¦-c2
¦-c20
¦-c21
¦-c210
¦-c2100
¦-c3
.
.
每一条目前都有一核选框表示选中与否，我想实现功能是当一节点选中时，其子节点能够全部选中，且子节点为只读，只有父节点没有选中时才可以对子节点进行操作（不考虑子节点没有全部选中父节点如何，即父节点应为没有选中状态），哪位大虾知道请帮助，或知道哪里能够找到答案，谢谢！！
...全文
96 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
cayyr 2001-11-19
  • 打赏
  • 举报
 回复
多谢karma(无为)老兄
下次有机会过来 记得发个email通知我一声
cayyr@sina.com
karma 2001-11-19
  • 打赏
  • 举报
 回复
Here is a demo for a checkbox tree. The tree code follows what is in
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnmind99/html/htmltree.asp

The original tree code was in VBScript, I re-wrote it in Javascript. You need to get three images, "bullet-plus.png", "bullet-minus.png" and "bullet-filler.png". "bullet-filler.png" is for alignment purpose and needs to have a same size as "bullet-plus.png" and "bullet-minus.png". You need replace them with your own images.

To get 父节点的值, click on "Get Checked" button.

<HTML>
<HEAD>
<TITLE>Checkbox Tree </TITLE>
</HEAD>

<BODY TEXT="#000000" BGCOLOR="#FFFFFF"
TOPMARGIN=0 LEFTMARGIN=10>

<BASE TARGET="cdMain">

<STYLE>
IMG { cursor:hand; }
</STYLE>

<DIV ID=C-0 STYLE="margin-left:10;">
<IMG SRC="images/bullet-plus.png" ID=M-1><input type="checkbox" value="c0">root<BR>
<DIV ID=C-1 STYLE="margin-left:15; display:None;">
<IMG SRC="images/bullet-plus.png" ID=M-2><input type="checkbox" value="c1">-c1<BR>
<DIV ID=C-2 STYLE="margin-left:15; display:None;">
<IMG SRC="images/bullet-filler.png"><input type="checkbox" value="c10">-c10<BR>
<IMG SRC="images/bullet-filler.png"><input type="checkbox" value="c11">-c11<BR>
</DIV>
<IMG SRC="images/bullet-plus.png" ID=M-3><input type="checkbox" value="c2">-c2<BR>
<DIV ID=C-3 STYLE="margin-left:15; display:None;">
<IMG SRC="images/bullet-filler.png"><input type="checkbox" value="c20">-c20<BR>
<IMG SRC="images/bullet-plus.png" ID=M-30><input type="checkbox" value="c21">-c21<BR>
<DIV ID=C-30 STYLE="margin-left:15; display:None;">
<IMG SRC="images/bullet-plus.png" ID=M-310><input type="checkbox" value="c210">-c210<BR>
<DIV ID=C-310 STYLE="margin-left:15; display:None;">
<IMG SRC="images/bullet-filler.png"><input type="checkbox" value="c2100">-c2100<BR>
</DIV>
</DIV>
</DIV>
<IMG SRC="images/bullet-filler.png"><input type="checkbox" value="c3">-c3<BR>
</DIV>
</DIV>

<INPUT TYPE="button" VALUE="Get Checked" ONCLICK="alert(GetValue(document.all('C-0')));">
<SCRIPT LAMGUAGE="JAVASCRIPT">
function document.onclick()
{
var i, strParentId;
var objChild, objParentImage;
var sDisplay,sImage;

strParentId = window.event.srcElement.id;
if (window.event.srcElement.tagName == "IMG" && strParentId.substring(0,1) == "M")
{
//Identify child DIV and parent IMG objects
objChild = document.all("C" + strParentId.substring(1));
objParentImage = document.all("M" + strParentId.substring(1));
//== manipulate their attributes
if (objChild.style.display == "none")
{
objChild.style.display = "";
objParentImage.src = "images/bullet-minus.png";
}
else
{
objChild.style.display = "none";
objParentImage.src = "images/bullet-plus.png";
}
objChild = null;
objParentImage = null;
}
else if (event.srcElement.tagName == "INPUT" && event.srcElement.type=="checkbox")
{
var state = event.srcElement.checked;
//alert(state);

var oDiv = GetNextDiv(event.srcElement);
if (oDiv)
ProcessChildren(oDiv, state);

}
}

function GetNextDiv(obj)
{
var nIndex = obj.sourceIndex;
++nIndex;
while (document.all[nIndex] && document.all[nIndex].tagName != "DIV")
++nIndex;
if (document.all[nIndex] && document.all[nIndex].tagName == "DIV" && document.all[nIndex].parentElement == obj.parentElement)
return document.all[nIndex];
else
return null;
}

function GetNextSiblingDiv(obj)
{
var nIndex = obj.sourceIndex;
++nIndex;
while (document.all[nIndex] && document.all[nIndex].tagName != "DIV" && document.all[nIndex] && document.all[nIndex].tagName != "INPUT")
++nIndex;
if (document.all[nIndex] && document.all[nIndex].tagName == "DIV" && document.all[nIndex].parentElement == obj.parentElement)
return document.all[nIndex];
else
return null;
}

function ProcessChildren(oParent, state)
{
//alert(oParent.all.length);
inputs = oParent.all.tags("INPUT")
for (var i=0; i < oParent.all.length; i++)
{
if (oParent.all[i].type=="checkbox")
{
oParent.all[i].checked = state;
if (state)
oParent.all[i].onclick=new Function("event.cancelBubble=true;event.returnValue = false; return false;");
else
oParent.all[i].onclick = null;
}
}
}

function GetValue(obj)
{
var s = "";
var children = obj.children.tags("INPUT");
if (children)
{
if (children.length)
{
for (var i=0; i < children.length; i++)
{
if (children[i].type == "checkbox")
{
if (children[i].checked)
s += "," + children[i].value;
else
{
var oDiv =GetNextSiblingDiv(children[i]);
var s2="";
if (oDiv)
s2 = GetValue(oDiv);
if (s2 != "")
s += "," +s2;
}
}
}
}
else
{
if (children.checked)
s += "," + children.value;
}
}

if (s != "")
s = s.substring(1);

return s;
}

</SCRIPT>
</BODY>
</HTML>


cayyr 2001-11-19
  • 打赏
  • 举报
 回复
karma(无为)老兄好　困了 睡到现在才起来
对 就是象csdn这样的树，想要的就是个checkboxtree
象http://www.screenbooks.net/jorr/js/checktree.htm那样的，但它好象要ie5.5+支持

checkbox传值时只传父节点的值，是想传给后端的jsp进行处理
如选择节点c1,c21,后端checkbox的value应该为c1,c10,c11,c21,c210,c2100,但我想得到的只是父节点的值，即checkbox的value为c1,c21
或者用个隐含的什么东东传过来也行


karma 2001-11-18
  • 打赏
  • 举报
 回复
"最好能树形展开"?
什么样的树形？类似CSDN的？

"还有就是，checkbox传值时只传父节点的值"
你要给谁传值？怎么传法？
karma 2001-11-18
  • 打赏
  • 举报
 回复
如去北京，定去打搅，多谢

对不起，我不再用OICQ了
cayyr 2001-11-18
  • 打赏
  • 举报
 回复
多谢 karma(无为）老兄 兄弟在此谢过

我要的基本就是这样的东东，但最好能树形展开
还有就是，checkbox传值时只传父节点的值

如你在北京，要乐意，哥们想请你撮一顿
oicq:25802755 我现在在网上
karma 2001-11-18
  • 打赏
  • 举报
 回复
我不知道你说的CHECKBOXMENU是什么样的，但根据你描述的要求，我做了一个类似的CHECKBOX树，虽然看上去并不好看，但不妨一看

<html>
<head>
<style type="text/css">
UL {list-style:none}
</style>
<script language="javascript">
function document.onclick()
{
if (event.srcElement.tagName == "INPUT" && event.srcElement.type=="checkbox")
{
var state = event.srcElement.checked;
var children = event.srcElement.parentElement.children;
if (children.length>1)
{
ProcessChildren(children[1],state);
}
}

}

function ProcessChildren(oParent, state)
{
//alert(oParent.all.length);
for (var i=0; i < oParent.all.length; i++)
{
if (oParent.all[i].tagName == "INPUT" && oParent.all[i].type=="checkbox")
{
oParent.all[i].checked = state;
if (state)
oParent.all[i].onclick=new Function("event.cancelBubble=true;event.returnValue = false; return false;");
else
oParent.all[i].onclick = null;
}
}
}

</script>
</head>
<body>
root
<ul>
<li><input type="checkbox">-c1
<ul>
<li><input type="checkbox">-c10</li>
<li><input type="checkbox">-c11</li>
</ul>
</li>
<li><input type="checkbox">-c2
<ul>
<li><input type="checkbox">-c20</li>
<li><input type="checkbox">-c21
<ul>
<li><input type="checkbox">-c210
<ul>
<li><input type="checkbox">-c2100</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><input type="checkbox">-c3</li>
</ul>
</body>
</html>
放射型配电网线路参数说明
放射型配电网数据参数说明，包含13节点、34节点等的说明
opendss123节点源码
在opendss下计算123节点的配电网的潮流
opendss34节点代码
opendss下计算34节点配电网潮流计算源代码
策略模式
策略模式是针对一组算法，将每一个算法封装到具有共同接口的独立的类中，从而使得它们可以相互替换。策略模式使得算法可以在不影响到客户端的情况下发生...现在有个需求要对一组数据进行排序，但由于各种原因，排序的方
测试url能否访问
/** * 自定义业务异常 * @author zhangchunlei */ public class BusinessException extends RuntimeException{ private static final long serialVersionUID = 4120420372097174366L; private String msg; ...
JavaScript

87,907

社区成员

224,614

社区内容

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

加载中

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

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

+ 用AI写文章