checkbox单选的问题

我要实现单选、或者不选，我现在做到了不选，但是不知道单选怎么做了（选择一个弹出来一个隐藏的）
<script type="text/javascript">
     function showPanel(sid,eid){
        var s = document.getElementById(sid);
        var e = document.getElementById(eid);
        if(s.checked){
            e.style.display="block";
            e.style.overflow="auto";
            e.style.height="100%";
        } else {
            e.style.display="none";
            e.style.overflow="hidden";
            e.style.height="0";
        }
     }
</script>
<input type="checkbox" name="cbox" value="cbox1" id="cbox1" onClick="showPanel('cbox1','panel1');"><label for="cbox1">checkBox1</label>
<input type="checkbox" name="cbox" value="cbox2" id="cbox2" onClick="showPanel('cbox2','panel2');"><label for="cbox2">checkBox2</label>请大家多多指教

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

写个单选
     function selectOne(obj){
        var fruits = document.getElementsByName("fruits");
         for (i=0; i<fruits.length; i++){
             if (fruits[i]!=obj){
                fruits[i].checked = false;
             }
             else {
                fruits[i].checked = true;
             }
         }
     }<body>
    <form id="form1" runat="server">
    <div>
     <input type="checkbox" name="fruits" value="apple" onclick="selectOne(this);" />apple<br />
     <input type="checkbox" name="fruits" value="banana" onclick="selectOne(this);" />banana<br />
     <input type="checkbox" name="fruits" value="pear" onclick="selectOne(this);" />pear<br />
     <input type="checkbox" name="fruits" value="orange" onclick="selectOne(this);" />orange<br />
    </div>
    </form>
</body>希望能给你帮助
var s = document.getElementById(sid);
if(s.checked)
不是已经知道谁被选中了吗？
假如页面上像分模块一样显示checkbox组比如说你喜欢的水果一组
还有兴趣一组等等这种情况可以在外层用DIV 然后进行控制建议:一般单选都是用单选框radiobuttion来做的  用checkbox来做总感觉很别扭~
我想实现的效果是    有两个checkbox（cbox1、cbox2）   只能选择一个，也可以都不选择
选择cbox1  弹出来一个层pannel1
选择cbox1  弹出来一个层pannel2
我现在做出来的还是可以多选  我javascript很菜  请大家多多指教
function showPanel(sid,eid){
        var s = document.getElementById(sid);
        var e = document.getElementById(eid);
        if(s.checked){
            e.style.display="block";
            e.style.overflow="auto";
            e.style.height="100%";
　　　　　　document.getElementById("cbox2").disabled=true;
        } else {
            e.style.display="none";
            e.style.overflow="hidden";
            e.style.height="0";
　          document.getElementById("cbox1").disabled=true;
        }
    }
是这样效果么
上面的得改一下，把disabled=true都改成checked=false; ..
但是s.checked   是不能确定你选择的是cbox1  还是cbox2的，怎么可以直接document.getElementById("cbox2").checked＝true呢？
如果你第一次就点击的cbox2呢没有明白为啥
js修改下就可以了
function selectOne(obj){
        var fruits = document.getElementsByName("fruits");
         for (i=0; i<fruits.length; i++){
             if (fruits[i]!=obj){
                fruits[i].checked = false;
             }
             else {
                if(obj.checked == false) {
                    fruits[i].checked = false;
                }
                else {
                    fruits[i].checked = true;
                }

             }
         }
     }
function showPanel(sid,eid，nosid){
        var s = document.getElementById(sid);
        var e = document.getElementById(eid);
        if(s.checked){
            e.style.display="block";
            e.style.overflow="auto";
            e.style.height="100%";
            document.getElementById(nosid).checked=false;
        } else {
            e.style.display="none";
            e.style.overflow="hidden";
            e.style.height="0";
        }
    }
input type="checkbox" name="cbox" value="cbox1" id="cbox1" onClick="showPanel('cbox1','panel1','cbox2');"> <label for="cbox1">checkBox1 </label>
<input type="checkbox" name="cbox" value="cbox2" id="cbox2" onClick="showPanel('cbox2','panel2','cbox1');"> <label for="cbox2">checkBox2 </label>
呵呵     这样啊   没有想到
我试一下   javascript我是一窍不通
我给的例子是个思路而已
虽然你写可以实现  但是如果3个以上怎么办  如果100个呢  就是味之数的时候
你的方法就不行了
帮你写了个灵活的  按照你的要求运行OK
function showPanel(obj){
        var cboxs = document.getElementsByName("cbox");

         for (i=0; i<cboxs.length; i++){
            var panel = document.getElementById("panel" + cboxs[i].id.substring(cboxs[i].id.length - 1))
            if (cboxs[i]!=obj){
                cboxs[i].checked = false;

                panel.style.display="none";
                panel.style.overflow="hidden";
                panel.style.height="0";
             }
             else {
                if(obj.checked == false) {
                    cboxs[i].checked = false;
                    panel.style.display="none";
                    panel.style.overflow="hidden";
                    panel.style.height="0";
                }
                else {
                    cboxs[i].checked = true;

                    panel.style.display="block";
                    panel.style.overflow="auto";
                    panel.style.height="100%";
                }
             }
         }<input type="checkbox" name="cbox" value="cbox1" id="cbox1" onclick="showPanel(this);" />
     <input type="checkbox" name="cbox" value="cbox2" id="cbox2" onclick="showPanel(this);" />
      <asp:Panel ID="panel1" runat="server"  style="display:none">
        <label for="cbox1">checkBox1 </label>
        </asp:Panel>
     <asp:Panel ID="panel2" runat="server" style="display:none">
        <label for="cbox2">checkBox2 </label>
        </asp:Panel>
呵呵  谢谢楼上的哥们，我就两个checkbox多的话就要使用你给的循环了，主要对javascript不怎么会用，谢谢大家帮忙，