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

我不知道你说的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>

解决方案 »

  1.   

    多谢 karma(无为）老兄  兄弟在此谢过 我要的基本就是这样的东东，但最好能树形展开
    还有就是，checkbox传值时只传父节点的值如你在北京，要乐意，哥们想请你撮一顿
    oicq:25802755 我现在在网上
      

  2.   

    如去北京，定去打搅，多谢对不起，我不再用OICQ了
      

  3.   

    "最好能树形展开"?
    什么样的树形？类似CSDN的？"还有就是，checkbox传值时只传父节点的值"
    你要给谁传值？怎么传法？
      

  4.   

    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
    或者用个隐含的什么东东传过来也行
      

  5.   

    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.aspThe 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>
      

  6.   

    多谢karma(无为)老兄
    下次有机会过来 记得发个email通知我一声
    [email protected]