Question

我在表单中有两个复选框。 onclick如果取消选中一个名为email的复选框，如何取消选中另一个复选框（如果已选中）？

document.getElementById('email').onclick = function() {
     if (!this.checked) {
        !document.getElementById("other").checked;
    } else {
        // if not checked ...
    }
};

我是否完全吠叫了错误的树？任何帮助appriciated

Answer 1

要同时检查两者，您只需要使用第二个this.checked属性中第一个点击的checked，如：

document.getElementById("other").checked = this.checked;

注意：这将在一种方式下工作，这意味着当您点击已将点击事件附加到的第一个checkbox时，检查将会同步。

document.getElementById('email').onclick = function() {
    document.getElementById("other").checked = this.checked;
};

<input id="email" type="checkbox" /> CHECKBOX 1
<br>
<input id="other" type="checkbox" /> CHECKBOX 2

Answer 2

在测试代码中，您没有将“other”的 checked 属性设置为任何值。你只是读它的值，然后反转它（用！）。

你可以尝试：

document.getElementById("other").checked = false;

Answer 3

你可以这样做：

<form id="test" action="#" method="post">
    <div>
        <input type="checkbox" name="check" id="check"/>
    </div>

        <div>
        <input type="checkbox" name="check2" id="check2"/>
    </div>
</form>

document.getElementById（'check'）。onclick = function（）{

 if (!this.checked) {
    document.getElementById("check2").checked = false;
} else {

    // other logic ...
}};

在jsfiddle上在线测试：https://jsfiddle.net/3dtq0w8x/

Answer 4

您可以将事件监听器添加到email复选框（这是一个很好的做法），然后检查是否检查并根据该处理其他复选框

例如

＆＃13;

var ckb = document.getElementById('email')
ckb.addEventListener("click", function(e){
  if(!e.target.checked)
      document.getElementById('ot').checked = false;
})

＆＃13;

<input type="checkbox" name="na" value="email" id="email">Email<br>
<input type="checkbox" name="na" value="other" id="ot">Other

＆＃13;

Answer 5

这应该有帮助

function check() {
if(document.getElementById("email").checked){ 
    document.getElementById("other").checked = true;
}else{
    document.getElementById("other").checked = false;
}

}

HTML

<input type='checkbox' id='email' name='checkbox' onclick="check()" >email
<input type='checkbox' id='other' name='checkbox'>other

取消选中一个复选框，另一个复选框将取消选中

5 个答案: