जांचें कि क्या सभी चेकबॉक्स चयनित हैं


139

यदि सभी चेकबॉक्स class="abc"चयनित हैं, तो मैं कैसे जांच करूं ?

मुझे हर बार उनमें से किसी एक को चेक करने या अनियंत्रित करने की आवश्यकता है। क्या मैं इसे क्लिक या चेंज पर करूं?

जवाबों:


257

मुझे लगता है कि इस स्थिति के लिए सबसे आसान तरीका जाँच है:

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

हर बार नया चेकबॉक्स चेक करने पर आप ऐसा कर सकते हैं:

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

2
lengthयह एक मजेदार बात नहीं है जो मुझे लगता है कि आपका मतलब है ..size()
— जिष्णु एपी

3
धन्यवाद @ TheSuperTramp! मेरा मतलब था length, लेकिन मैं कभी नहीं भूल सकता कि यह एक संपत्ति है और एक विधि नहीं है। सही किया
— cbrandolino

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

2
सही, साफ और सुरुचिपूर्ण समाधान। "अगर ($ ('input.abc') नहीं। (": चेक किया हुआ ")। लंबाई) {...}" भी काम करता है।
— स्कोरुनका फ्रांटिसेक

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 Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.