繁体   English   中英

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

[英]Uncheck a checkbox and another checkbox will untick

我在表单中有两个复选框。 onclick如果未选中一个名为email的复选框,我如何才能将另一个复选框也取消选中(如果已选中)?

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

我是否完全将错误的树吠叫? 任何帮助

要同时同步两者的检查,您只需要使用this.checked在第二个对象的checked属性上单击的第一个对象,例如:

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

注意:这将以一种方式起作用,这意味着仅当您单击附加了click事件的第一个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 

在测试代​​码中,您未将“其他”的选中属性设置为任何值。 您只是在读取其值,然后将其取反(用!)。

您可以尝试:

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

您可以像这样:

<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/

您可以将事件侦听器添加到email复选框(这是一种很好的做法),然后检查是否为选中状态,并根据该复选框处理另一个复选框。

例如

 var ckb = document.getElementById('email') ckb.addEventListener("click", function(e){ if(!e.target.checked) document.getElementById('ot').checked = false; }) 
 <input type="checkbox" name="na" value="email" id="email">Email<br> <input type="checkbox" name="na" value="other" id="ot">Other 

这应该有帮助

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM