当checkbox选中时，旋钮才能点击。checkbox没有被选中时，按钮为不能点击的状态

当checkbox选中时，按钮才能点击。checkbox没有被选中时，按钮为不能点击的状态
这段代码都是在网上当下来的，本人略有修改，实在不会了，求帮忙！！！
最终效果：就餐时间段、就餐人数只有同时都只选择一个的时候 “提交”按钮才可以点击其他情况都是灰色的。

代码：
<html>
<head>
<title>change BG color</title>
</head>
<Script Language="JScript">

function btnAction(){
alert(document.getElementById("xz").disabled);

alert(2);
}
function check(){
//判断checkbox有没有被选中
if(document.getElementById("ch").checked==true)
{
document.getElementById("xz").disabled="";//给BUTTON按钮的disabled属性赋值

}else
{
document.getElementById("xz").disabled="disabled";
}

}

function checkedThis(obj,name){
var boxArray = document.getElementsByName(name);
for(var i=0;i<=boxArray.length-1;i++){
if(boxArray[i]==obj && obj.checked){
boxArray[i].checked = true;
}else{
boxArray[i].checked = false;
}
}
}
</script>
<body>

就餐时间段

<input type="checkbox" name="test" onClick="checkedThis(this,'test');">早餐
<input type="checkbox" name="test" onClick="checkedThis(this,'test');">午餐
<input type="checkbox" name="test" onClick="checkedThis(this,'test');">晚餐------

就餐人数

<input type="checkbox" name="test1" onClick="checkedThis(this,'test1');">1-2人
<input type="checkbox" name="test1" onClick="checkedThis(this,'test1');">3-6人
<input type="checkbox" name="test1" onClick="checkedThis(this,'test1');">6-10人

<input type="button" value="提交" onClick="btnAction()" id="xz" disabled="disabled"/>
<input name="check" id="ch" type="checkbox" onClick="check()"/>
</body>
</html>

------解决方案--------------------
是单选的，改为radio不好吗？干嘛用checkbox

HTML code

<html>
<head>
<title>change BG color</title>
</head>
<script type="text/javascript"><!---这里要这样写，不要用language，如果用要设置为javascript，而不是jscript，jscript是IE的东东---->

    function btnAction() {
        alert(document.getElementById("xz").disabled);

        alert(2);
    }
    function check() {
        //判断checkbox有没有被选中
        if (document.getElementById("ch").checked == true) {
            document.getElementById("xz").disabled = ""; //给BUTTON按钮的disabled属性赋值

        } else {
            document.getElementById("xz").disabled = "disabled";
        }

    }

    function checkedThis(obj) {
        var test = document.getElementsByName('test'), test1 = document.getElementsByName('test1'), i, j, num = [0, 0];

        for (i = 0, j = test.length; i < j; i++) if (test[i].checked) num[0]++;
        for (i = 0, j = test1.length; i < j; i++) if (test1[i].checked) num[1]++;

        if (num[0] == 1 && num[1] == 1) document.getElementById('xz').disabled = false;
        else document.getElementById('xz').disabled = true;
    } 
</script>
<body>


就餐时间段

<input type="checkbox" name="test" onClick="checkedThis(this);">早餐
<input type="checkbox" name="test" onClick="checkedThis(this);">午餐
<input type="checkbox""" name="test" onClick="checkedThis(this);">晚餐------ 



就餐人数

<input type="checkbox" name="test1" onClick="checkedThis(this);">1-2人
<input type="checkbox" name="test1" onClick="checkedThis(this);">3-6人
<input type="checkbox" name="test1" onClick="checkedThis(this);">6-10人


<input type="button" value="提交" onClick="btnAction()" id="xz" disabled="disabled"/> 
<input name="check" id="ch" type="checkbox" onClick="check()"/>
</body>
</html>

当checkbox选中时，旋钮才能点击。checkbox没有被选中时，按钮为不能点击的状态

相关推荐