Быстрый способ проверить, не отмечены ли все флажки?

Есть ли быстрый способ или функция, которая сообщит мне истину/ложь, если все флажки сняты? Не проходя через массив? (с JS и HTML)

Все мои флажки имеют одно и то же имя...

<form action="/cgi-bin/Lib.exe" method=POST name="checks" ID="Form2">
    <input type=checkbox name="us" value="Joe" ID="Checkbox1">
    <input type=checkbox name="us" value="Dan" ID="Checkbox2">
    <input type=checkbox name="us" value="Sal" ID="Checkbox3">
</form>

javascript validation forms input html
person T.T.T.    schedule 28.05.2009    source источник

Ответы (8)


arrow_upward
5
arrow_downward

Вы должны пройти через них. Даже такая библиотека, как jQuery, будет проходить через них, просто спрячьте это от вас.

var form = document.getElementById('Form2');
var inputs = form.getElementsByTagName('input');
var is_checked = false;
for(var x = 0; x < inputs.length; x++) {
    if(inputs[x].type == 'checkbox' && inputs[x].name == 'us') {
        is_checked = inputs[x].checked;
        if(is_checked) break;
    }
}
// is_checked will be boolean 'true' if any are checked at this point.
person Paolo Bergantino    schedule 28.05.2009
comment
Разве это не вернется, если последний флажок установлен? Например. Сал в примере. - person svinto; 29.05.2009

arrow_upward
7
arrow_downward

jQuery был бы массой ненужного раздувания для такой тривиальной задачи. Подумайте об использовании его, если вы используете его для других целей, но все, что вам нужно, это что-то вроде этого:

function AreAnyCheckboxesChecked () {
  var checkboxes = document.forms.Form2.elements.us;
  for (var i = 0; i < checkboxes.length; i++) {
    if (checkboxes[i].checked) {
      return true;
    }
  }
  return false;
}
person Quentin    schedule 28.05.2009

arrow_upward
4
arrow_downward

JavaScript:

var allischecked = (function(){
  var o = document.getElementById("Form2").getElementsByTagName("input");
  for(var i=0,l=o.length;i<l;i++){
    o[i].type === "checkbox" && o[i].name === "us" && o[i].checked || return false;
  }
  return true;
})();

С jQuery:

var allischecked = ($("#Form2 input:checkbox:not(checked)").length === 0);
person svinto    schedule 28.05.2009
comment
+1 за показ версии JQuery. Да, если это все, что вы хотите сделать, JQuery — это излишество. Но если у вас есть другая проверка, AJAX и т. д., однострочный тест трудно превзойти. - person GalacticCowboy; 31.05.2009

arrow_upward
2
arrow_downward

Таким образом, этот snipped вернет true, если НЕ будут проверены все. Он выручает, как только проверенный найден.

var a = document.getElementsByName("us");
for(var i=0; i<a.length; i++)
   if(a[i].checked)
      return false;
return true;

(не проверял, но концептуально верно)

person gahooa    schedule 28.05.2009
comment
Спасибо за ссылку - не видел эту схему раньше - person Russ Cam; 29.05.2009

arrow_upward
0
arrow_downward

Что ты имеешь ввиду

Не проходя через массив

?

Вы могли бы просто сделать

 function check() {
    var anyChecked = false;
    var form = document.getElementById('Form2');
    var checkboxes = form.getElementsByTagName('input');
    for(var i=0; i < checkboxes.length; i++) {
            if (checkboxes[i].checked) {
                anyChecked  = true;
                break;
            }
    } 
    alert("Checkboxes checked? " + anyChecked);
}

Рабочая демонстрация

person Russ Cam    schedule 28.05.2009
comment
getElementsByName необычен в IE и немного в Opera: quirksmode.org/dom/w3c_core.html, я стараюсь вообще этого избегать. - person Paolo Bergantino; 29.05.2009

arrow_upward
0
arrow_downward

Если у вас есть большое количество флажков, которые вы не хотите проверять в цикле, может быть более эффективным использовать этот подход.

var checked = 0;

$("input[type=checkbox]").live("click", function() {
    if($(this).attr("checked")) checked++;
    else checked--;
}

Тогда вы сможете проверить, как это.

if(checked === 0) {
    doSomething();
}
person Community    schedule 28.05.2009

arrow_upward
0
arrow_downward

Правильное решение с атрибутом jQuery checked:

$checkboxes = $('#Form2 input:checkbox');
$checkboxes.on('click', checkboxes);

function checkboxes() {
  var allChecked = $checkboxes.not(':checked').length == 0;
  console.log(allChecked);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<form action="/cgi-bin/Lib.exe" method=POST name="checks" ID="Form2">
    <input type=checkbox name="us1" value="Joe" ID="Checkbox1"><label>Joe</>
    <input type=checkbox name="us2" value="Dan" ID="Checkbox2"><label>Dan</>
    <input type=checkbox name="us3" value="Sal" ID="Checkbox3"><label>Sal</>
</form>

person MaxZoom    schedule 29.08.2018

arrow_upward
0
arrow_downward

Без петли еще проще

const toggleCheckboxes = checkbox => {
   if(checkbox.checked){
      return true
   }else{
      if(document.querySelectorAll(':checked').length === 0){
          // All are unchecked
          return false
      }
   }
}
person Hracho Avagyan    schedule 28.02.2020