取消選中一個復選框，另一個復選框將取消選中

Question

我在表單中有兩個復選框。 onclick如果未選中一個名為email的復選框，我如何才能將另一個復選框也取消選中（如果已選中）？

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

我是否完全將錯誤的樹吠叫？ 任何幫助

Answer 1

要同時同步兩者的檢查，您只需要使用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 

Answer 2

在測試代​​碼中，您未將“其他”的選中屬性設置為任何值。 您只是在讀取其值，然后將其取反（用！）。

您可以嘗試：

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復選框（這是一種很好的做法），然后檢查是否為選中狀態，並根據該復選框處理另一個復選框。

例如

 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 

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