javascript - 带有 && 和 || 的 IF ELSE 语句状况

Question

我有一组复选框(id =“first”id =“second”)和主复选框(id =“main”)。

<input type='checkbox' id="main_button" onclick="Indeterminate()"><label for="main_button">Main checkbox of group</label> 
<input type='checkbox' id="first" onclick="Indeterminate()"><label for="first">First thing</label>
<input type='checkbox' id="second" onclick="Indeterminate()"><label for="second">Second thing</label>

如果选中了一个或多个组复选框，则主要的条件处于不确定状态。如果全部选中，则主复选框也已选中条件。

function Indeterminate() {
    if (document.getElementById('first').checked || document.getElementById('second').checked) {
        document.getElementById('main_button').indeterminate = true;
    } else if (document.getElementById('first').checked && document.getElementById('second').checked) {
        document.getElementById('main_button').checked;
    } else { 
        document.getElementById('main_button').indeterminate = false; 
    }    
}

在我的 IF ELSE 语句中，条件 IF 和 ELSE 有效，但 ELSE IF 出现问题。可能犯了一个简单的错误或者？谢谢!

JSFiddle example

Answer 1

var main = document.getElementById('main_button');
var first = document.getElementById('first');
var second = document.getElementById('second');

function Indeterminate() {
  if (first.checked && second.checked) {
    main.checked = true;
    main.indeterminate = false;
  } else if (first.checked || second.checked)
    main.indeterminate = true;
  else
    main.indeterminate = false;

}

<input type='checkbox' id="main_button" onclick="Indeterminate()">
<label for="main_button">Main checkbox of group</label>
<input type='checkbox' id="first" onclick="Indeterminate()">
<label for="first">First thing</label>
<input type='checkbox' id="second" onclick="Indeterminate()">
<label for="second">Second thing</label>