Question

<script>
function tryThis(element){

    if(element.checked){
        element.classList.add("marked");
    }else{
        element.classList.remove("marked");
    }

    if(document.getElementsByClassName("marked").length>1){
      alert("Please select only one check box");
        element.checked=false;
        element.classList.remove("marked");
    }
    if(document.getElementsByClassName("marked").length==0){
         alert("Please select one check box");
    }
}
</script>
<div>
<input type="checkbox" name="gender" value="male" onclick="tryThis(this);"/>
<input type="checkbox" name="gender" value="female" onclick="tryThis(this);"/>
<input type="checkbox" name="gender" value="unknown" onclick="tryThis(this);"/>
</div>

<div>
<input type="checkbox" name="report" value="no" onclick="tryThis(this);"/>
<input type="checkbox" name="report" value="yes" onclick="tryThis(this);"/>
<input type="checkbox" name="report" value="other" onclick="tryThis(this);"/>
</div>

这是我尝试过的代码的一个小例子（我从另一个线程中找到了这个函数）。我在这里遇到的问题是我想要从每个复选框组中选择一个复选框，但事实证明，所有组都选择了一个复选框，即当我选择“男性”时。在性别＆＃39;我应该可以选择“是”＆＃39;在报告中，但没有发生。我在这里缺少什么？

Answer 1

您可以使用单选按钮

执行此操作

<input type="radio" name="age" value="10">10-20
<input type="radio" name="age" value="20">20-30
<input type="radio" name="age" value="30">30+

<input type="radio" name="sex" value="female">Female
<input type="radio" name="sex" value="male">Male

“name”属性分组按钮

Answer 2

这可能是正确方向的开始。注意我可以通过刷新页面来搞乱状态。

CSet: TSet = [eA, eB, eC];

在javascript中的每个复选框组中只选择一个复选框

2 个答案: