Перевірте, чи встановлені всі прапорці


139

Як перевірити, чи class="abc"вибрані всі прапорці з ?

Мені потрібно перевіряти це кожного разу, коли один із них перевіряється чи не перевіряється. Чи потрібно це зробити при натисканні чи зміні?

Відповіді:


257

Я думаю, що найпростішим способом є перевірка цього стану:

$('.abc:checked').length == $('.abc').length

Ви можете це робити щоразу, коли буде встановлено новий прапорець:

$(".abc").change(function(){
    if ($('.abc:checked').length == $('.abc').length) {
       //do something
    }
});

2
lengthце не фунсіон, я думаю, ви мали на увазі ..size()
Jishnu AP

3
Дякую @TheSuperTramp! Я мав на увазі length, але я ніколи не забуваю забути, що це властивість, а не метод. Виправлено
cbrandolino

97
$('input.abc').not(':checked').length > 0

2
Ідеальне, чисте та елегантне рішення. "if ($ ('input.abc'). not (": перевірено "). довжина) {...}" також працює.
Скорунька Франтишек

1
Ця відповідь не правильна. Він перевіряє, чи немає прапорців. Але питання - Перевірити, чи встановлені всі прапорці . Таким чином, правильний код: $('input.abc').not(':checked').length === 0.
hlcs

1
Ця відповідь краще, ніж прийнята відповідь, якщо врахувати ефективність. Це буде циклічно лише один раз, а не два рази.
Maarten Kieft

15

Можна використовувати change()

$("input[type='checkbox'].abc").change(function(){
    var a = $("input[type='checkbox'].abc");
    if(a.length == a.filter(":checked").length){
        alert('all checked');
    }
});

Все, що потрібно зробити, - це перевірити, чи загальна кількість .abcпрапорців відповідає загальній кількості .abc:checked.

Приклад коду на jsfiddle .


Не дуже впевнений чому, але мій a.length дає мені значення 8, тоді як у мене лише 4 прапорці.
Санта

Це filterхороше рішення для групи прапорців, велике спасибі.
загальнадука


3

Частина 1 вашого запитання:

var allChecked = true;
$("input.abc").each(function(index, element){
  if(!element.checked){
    allChecked = false;
    return false;
  } 
});

Редагувати:

Відповідь (http://stackoverflow.com/questions/5541387/check-if-all-checkboxes-are-selected/5541480#5541480) вище, ймовірно, краща.


1

Критерії пошуку є одним із таких:

input[type=checkbox].MyClass:not(:checked)
input[type=checkbox].MyClass:checked

Можливо, ви хочете підключитися до події зміни.


1

Крім того, ви могли також використовувати кожен ():

// Cache DOM Lookup
var abc = $(".abc");

// On Click
abc.on("click",function(){

    // Check if all items in list are selected
    if(abc.toArray().every(areSelected)){
        //do something
    }

    function areSelected(element, index, array){
        return array[index].checked;
    }
});

1

Класне незалежне рішення

var checkBox = 'input[type="checkbox"]';
if ($(checkBox+':checked').length == $(checkBox).length) {
   //Do Something
}

1

Ось як я цього досяг у своєму коді:

if($('.citiescheckbox:checked').length == $('.citiescheckbox').length){
    $('.citycontainer').hide();
}else{
    $('.citycontainer').show();
}
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.