चेक करें कि चेकबॉक्स jQuery के साथ चेक किया गया है या नहीं

Question

यदि चेकबॉक्स सरणी की आईडी का उपयोग करके चेकबॉक्स सरणी में चेकबॉक्स की जांच की जाती है, तो मैं कैसे जांच सकता हूं?

मैं निम्नलिखित कोड का उपयोग कर रहा हूं, लेकिन यह हमेशा आईडी की परवाह किए बिना चेक किए गए चेकबॉक्स की गिनती लौटाता है।

function isCheckedById(id) {
    alert(id);
    var checked = $("input[@id=" + id + "]:checked").length;
    alert(checked);

    if (checked == 0) {
        return false;
    } else {
        return true;
    }
}

Comments

एक चेकबॉक्स सरणी ? ऐसी बात कभी नहीं सुनी। क्या ऐसा कुछ JQuery के विशिष्ट, या एक प्लगइन / विजेट है?

— पेका

एक चेकबॉक्स सरणी का अर्थ कुछ इस प्रकार है: <इनपुट प्रकार = "चेकबॉक्स" नाम = "chk []" आईडी = "chk []" मूल्य = "सेब"> <इनपुट प्रकार = "चेकबॉक्स" नाम = "chk []" आईडी = "chk []" मूल्य = "केला"> <इनपुट प्रकार = "चेकबॉक्स" नाम = "chk []" id = "chk []" मूल्य = "नारंगी"> आदि ..

— जेक

चेकबॉक्स सरणी में क्या गलत है? आप "इनपुट लागू करने वाले सभी चेक" कैसे करेंगे?

— निकफ

सुनिश्चित करें कि आपके idएस अद्वितीय हैं! name(और इस मामले में) को दोहराना चाहिए, लेकिन अगर आप नकल करते हैं तो आपको बहुत सारी अजीब चीजें मिलेंगी id! = डी

— जेफ रूपर्ट

मुझे काम करने के लिए "@" को निकालना पड़ा। इसके अलावा, आप अंतिम 5 लाइनों को 1: रिटर्न (चेक किया गया! = 0) के लिए छोटा कर सकते हैं;

— बी क्ले शैनन

Answer 1

आपके दस्तावेज़ में आईडी अद्वितीय होनी चाहिए, जिसका अर्थ है कि आपको ऐसा नहीं करना चाहिए :

<input type="checkbox" name="chk[]" id="chk[]" value="Apples" />
<input type="checkbox" name="chk[]" id="chk[]" value="Bananas" />

इसके बजाय, आईडी ड्रॉप करें, और फिर उन्हें नाम से चुनें, या एक तत्व से:

<fieldset id="checkArray">
    <input type="checkbox" name="chk[]" value="Apples" />

    <input type="checkbox" name="chk[]" value="Bananas" />
</fieldset>

और अब jQuery:

var atLeastOneIsChecked = $('#checkArray:checkbox:checked').length > 0;
//there should be no space between identifier and selector

// or, without the container:

var atLeastOneIsChecked = $('input[name="chk[]"]:checked').length > 0;

Comments

मेरे लिए इनपुट नाम पर दोहरे उद्धरण चिह्नों के बिना काम किया: इनपुट [नाम = मल्टीकच []]: धन्यवाद!

— एलेजांद्रो क्विरोज़

$('#checkArray :checkbox:checked').length > 0;जब अधिक सरल $('#checkArray').checkedकाम करता है और अधिक संस्करणों पर उपलब्ध है , तो क्यों उपयोग करें ?

— डॉन चीडल

@Oddman यह काम करता है, सिर्फ एक jquery वस्तु पर नहीं। $ (elem) के बजाय .checked, elem.checked का प्रयास करें।

— डैन विलियम्स

@DanWilliams ने हां लेकिन उदाहरण में नहीं दिया जिसे mmcrae ने दिया।

— Oddman

दूसरे ने मेरे लिए काम किया। धन्यवाद!! var atLeastOneIsChecked = $('input[name="chk[]"]:checked').length > 0;

— डेविड सिल्वा-बैरेरा

Answer 2

$('#' + id).is(":checked")

अगर चेकबॉक्स की जाँच हो जाती है।

एक ही नाम वाले चेकबॉक्स की एक सरणी के लिए आप निम्न के द्वारा चेक किए गए लोगों की सूची प्राप्त कर सकते हैं:

var $boxes = $('input[name=thename]:checked');

फिर उनके माध्यम से लूप करें और देखें कि आप क्या जाँच कर सकते हैं:

$boxes.each(function(){
    // Do stuff here with this
});

यह जानने के लिए कि आप कितने जाँच कर सकते हैं:

$boxes.length;

Comments

एक और तरीका है $('#'+id).attr('checked'), जो $('#' + id).is(":checked")आईएमओ को याद रखने के लिए आसान लेकिन समान है ।

— जुबिन

@ ज़ुबिन: सावधान रहें .attr('checked')। इसका व्यवहार jQuery 1.6 में बदल गया। यह लौट आता था falseया true। अब यह लौटा undefinedया "checked"। .is(':checked')यह समस्या नहीं है।

— जॉय एडम्स

@ जॉन बोकर: नेक्रो टिप्पणी के लिए खेद है, लेकिन ऐसा क्यों है जो $('.ClassName').is(':checked')काम नहीं $('#' + id).is(":checked")करता है लेकिन करता है? इस तथ्य से अलग कि एक आईडी द्वारा और एक वर्ग नाम से दिखता है।

— माइक_बॉरेन

@Mike_OBrien समस्या यह हो सकती है कि उस वर्ग के नाम के साथ एक से अधिक चेकबॉक्स हो। Is (': check') वास्तव में केवल एक तत्व पर काम करता है।

— जॉन बोकर

नोट: आकार () को jQuery के 1.8 के बाद से हटा दिया गया है - इसके बजाय .length का उपयोग करें

— JM4

Answer 3

$('#checkbox').is(':checked'); 

यदि चेकबॉक्स चेक किया गया है या गलत है तो उपरोक्त कोड सही है।

Comments

$ (यह) .is (': चेक') का उपयोग करते समय बहुत उपयोगी; धन्यवाद!

— PinoyStackOverflower

चेकबॉक्स चेक करने पर यह तरीका मददगार है, जहाँ आप जानते हैं कि इसे कैसे चुनना है, धन्यवाद

— उमर इसैद

यह मेरे लिए काम करता है, मैंने पहले भी इसका इस्तेमाल किया var isChecked = $('#CheckboxID').attr('checked') ? true : false; था लेकिन हमेशा सही मूल्य नहीं लौटाया। तो धन्यवाद!

— लेईट

Answer 4

निम्नलिखित सभी तरीके उपयोगी हैं:

$('#checkbox').is(":checked")

$('#checkbox').prop('checked')

$('#checkbox')[0].checked

$('#checkbox').get(0).checked

यह अनुशंसा की जाती है कि डोमेलेमेंट या इनलाइन "this.checked" को टाला जाए बजाय इसके कि jQuery ऑन मेथड ईवेंट श्रोता का उपयोग किया जाए।

Answer 5

चेक बॉक्स चेक किया गया है या नहीं यह जांचने के लिए jQuery कोड:

if($('input[name="checkBoxName"]').is(':checked'))
{
  // checked
}else
{
 // unchecked
}

वैकल्पिक रूप से:

if($('input[name="checkBoxName"]:checked'))
{
    // checked
}else{
  // unchecked
}

Comments

पहला समाधान गायब है :... सही एक है if(('input[name="checkBoxName"]').is(':checked')):।

— एयरेंडिर

डॉलर का चिह्न ($) गायब है, यह होना चाहिए if($('input[name="checkBoxName"]').is(':checked'))।

— पेनी लियू

दूसरा कोई elseब्लॉक को कभी नहीं चलाएगा , क्योंकि एक jQuery ऑब्जेक्ट, भले ही इसमें कोई मिलान तत्व न हों, "सत्य" है। .lengthअंत में जोड़ें , फिर आप बात कर रहे हैं।

— बंदर

Answer 6

चेक की गई विशेषता के बारे में याद रखने के लिए सबसे महत्वपूर्ण अवधारणा यह है कि यह चेक की गई संपत्ति के अनुरूप नहीं है। विशेषता वास्तव में डिफॉल्ट चेक की गई संपत्ति से मेल खाती है और इसका उपयोग केवल चेकबॉक्स के प्रारंभिक मूल्य को निर्धारित करने के लिए किया जाना चाहिए। चेक किया गया गुण मान चेकबॉक्स की स्थिति के साथ परिवर्तित नहीं होता है, जबकि चेक की गई संपत्ति करता है। इसलिए, यह निर्धारित करने के लिए क्रॉस-ब्राउज़र-संगत तरीका कि चेकबॉक्स चेक किया गया है, तो संपत्ति का उपयोग करना है

नीचे दिए गए सभी तरीके संभव हैं

elem.checked 

$(elem).prop("checked") 

$(elem).is(":checked") 

Answer 7

आप इस कोड का उपयोग कर सकते हैं,

if($("#checkboxId").is(':checked')){
     // Code in the case checkbox is checked.
} else {
     // Code in the case checkbox is NOT checked.
}

Answer 8

JQuery प्रलेखन के अनुसार चेकबॉक्स चेक किया गया है या नहीं, यह जांचने के तरीके निम्नलिखित हैं। उदाहरण के लिए चेकबॉक्स पर विचार करें ( सभी उदाहरणों के साथ कार्यशील jsfiddle की जाँच करें )

<input type="checkbox" name="mycheckbox" id="mycheckbox" />
<br><br>
<input type="button" id="test-with-checked" value="Test with checked" />
<input type="button" id="test-with-is" value="Test with is" />
<input type="button" id="test-with-prop" value="Test with prop" />

उदाहरण 1 - जाँच के साथ

$("#test-with-checked").on("click", function(){
    if(mycheckbox.checked) {
        alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

उदाहरण 2 - jQuery के साथ, नोट -: चेक किया गया है

var check;
$("#test-with-is").on("click", function(){
    check = $("#mycheckbox").is(":checked");
    if(check) {
        alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

उदाहरण 3 - jQuery के प्रोप के साथ

var check;
$("#test-with-prop").on("click", function(){
    check = $("#mycheckbox").prop("checked");
    if(check) {
         alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

कार्यशील jsfiddle की जाँच करें

Answer 9

आप यह कोशिश कर सकते हैं:

<script>
function checkAllCheckBox(value)
{
   if($('#select_all_').is(':checked')){
   $(".check_").attr ( "checked" ,"checked" );
    }
    else
    {
        $(".check_").removeAttr('checked');
    }

 }

</script>
<input type="checkbox" name="chkbox" id="select_all_" value="1" />


<input type="checkbox" name="chkbox" class="check_" value="Apples" />
<input type="checkbox" name="chkbox" class="check_" value="Bananas" />
<input type="checkbox" name="chkbox" class="check_" value="Apples" />
<input type="checkbox" name="chkbox" class="check_" value="Bananas" />

Comments

यह अब चीजों को करने का एक अच्छा तरीका नहीं है, क्योंकि attrकेवल HTML में विशेषता मूल्य को दर्शाता है, न कि DOM में संपत्ति का मूल्य। देखें के लिए दस्तावेज़attr , जहां यह कहते हैं, "प्राप्त करने के लिए और इस तरह के रूप परिवर्तन डोम गुण checked, selectedया disabledप्रपत्र तत्वों का राज्य है, का उपयोग .prop()विधि।", और के लिए दस्तावेज़prop जहां यह कहते हैं, " .prop()विधि सेट करने के लिए इस्तेमाल किया जाना चाहिए disabledऔर checkedबजाय की .attr()विधि। "

— बंदर

Answer 10

आप jquery द्वारा निम्नलिखित में से किसी भी अनुशंसित कोड का उपयोग कर सकते हैं।

if ( elem.checked ) {};
if ( $( elem ).prop( "checked" ) ) {};
if ( $( elem ).is( ":checked" ) ) {};

Answer 11

मुझे पता है कि ओपी को जेक्वेरी चाहिए, लेकिन मेरे मामले में शुद्ध जेएस का जवाब था, अगर मेरे जैसा कोई भी व्यक्ति यहां है और उसके पास जॉकरी नहीं है या वह इसका इस्तेमाल नहीं करना चाहता है - यहां जेएस का जवाब है:

document.getElementById("myCheck").checked

यह सही है अगर आईडी माईचेक के साथ इनपुट की जाँच की जाती है और इसे चेक नहीं किया जाता है तो यह गलत है।

इतना ही आसान।

Comments

अर्थ है कि $("#myCheck")[0].checkedjquery में काम करेंगे! : डी

— संकर्ण

Answer 12

आप इसे बस पसंद कर सकते हैं;

वर्किंग फिडल

एचटीएमएल

<input id="checkbox" type="checkbox" />

jQuery

$(document).ready(function () {
    var ckbox = $('#checkbox');

    $('input').on('click',function () {
        if (ckbox.is(':checked')) {
            alert('You have Checked it');
        } else {
            alert('You Un-Checked it');
        }
    });
});

या और भी सरल;

$("#checkbox").attr("checked") ? alert("Checked") : alert("Unchecked");

यदि checkboxजाँच की गई तो यह trueअन्यथा वापस आ जाएगीundefined

Comments

or even simpler;->$("#checkbox").checked

— डॉन चीडल

Answer 13

यह भी एक विचार है जिसका मैं अक्सर उपयोग करता हूं:

var active = $('#modal-check-visible').prop("checked") ? 1 : 0 ;

अगर चबाया जाता है, तो यह 1 वापस आ जाएगा; अन्यथा यह 0 पर वापस आ जाएगा।

Answer 14

चेक बॉक्स की जाँच और सेटिंग के लिए सरल डेमो।

jsfiddle !

$('.attr-value-name').click(function() {
    if($(this).parent().find('input[type="checkbox"]').is(':checked'))
    {
        $(this).parent().find('input[type="checkbox"]').prop('checked', false);
    }
    else
    {
        $(this).parent().find('input[type="checkbox"]').prop('checked', true);
    }
});

Answer 15

बस मेरे उदाहरण में कहने के लिए स्थिति एक संवाद बॉक्स थी, जिसने संवाद बंद करने से पहले चेक बॉक्स को सत्यापित किया। उपरोक्त में से कोई भी नहीं और कैसे जांचें कि क्या jQuery में एक चेकबॉक्स चेक किया गया है? और अगर चेकबॉक्स की जाँच की जाती है तो jQuery काम नहीं करता है।

अंततः

<input class="cb" id="rd" type="checkbox">
<input class="cb" id="fd" type="checkbox">

var fd=$('.cb#fd').is(':checked');
var rd= $('.cb#rd').is(':checked');

इसने क्लास को कॉल करने का काम किया फिर आई.डी. बल्कि सिर्फ आईडी से। हो सकता है कि इस पृष्ठ पर नेस्टेड DOM तत्वों के कारण समस्या उत्पन्न हो। वर्कअराउंड ऊपर था।

Answer 16

एक आईडी के साथ चेकबॉक्स के लिए

<input id="id_input_checkbox13" type="checkbox"></input>

आप बस कर सकते हैं

$("#id_input_checkbox13").prop('checked')

आपको सिंटैक्स के ऊपर trueया falseवापसी मान मिलेगा । यदि आप सामान्य बूलियन अभिव्यक्ति के रूप में खंड में इसका उपयोग कर सकते हैं।

Answer 17

ऐसा कुछ मदद कर सकता है

togglecheckBoxs =  function( objCheckBox ) {

    var boolAllChecked = true;

    if( false == objCheckBox.checked ) {
        $('#checkAll').prop( 'checked',false );
    } else {
        $( 'input[id^="someIds_"]' ).each( function( chkboxIndex, chkbox ) {
            if( false == chkbox.checked ) {
                $('#checkAll').prop( 'checked',false );
                boolAllChecked = false;
            }
        });

        if( true == boolAllChecked ) {
            $('#checkAll').prop( 'checked',true );
        }
    }
}

Answer 18

दरअसल, jsperf.com के अनुसार , DOM ऑपरेशन सबसे तेज़ हैं, तो $ ()। Prop () के बाद $ () है () है !!

यहाँ वाक्यविन्यास हैं:

var checkbox = $('#'+id);
/* OR var checkbox = $("input[name=checkbox1]"); whichever is best */

/* The DOM way - The fastest */
if(checkbox[0].checked == true)
   alert('Checkbox is checked!!');

/* Using jQuery .prop() - The second fastest */
if(checkbox.prop('checked') == true)
   alert('Checkbox is checked!!');

/* Using jQuery .is() - The slowest in the lot */
if(checkbox.is(':checked') == true)
   alert('Checkbox is checked!!');

मैं व्यक्तिगत रूप से पसंद करता हूं .prop()। इसके विपरीत .is(), इसका उपयोग मूल्य निर्धारित करने के लिए भी किया जा सकता है।

Answer 19

चेकबॉक्स को टॉगल करें

$("#checkall").click(function(){
    $("input:checkbox").prop( 'checked',$(this).is(":checked") );
})

Answer 20

इस कोड का उपयोग करके आप कम से कम एक चेकबॉक्स का चयन कर सकते हैं या अलग-अलग चेकबॉक्स समूहों में या कई चेकबॉक्स से नहीं। इसके इस्तेमाल से आपको आईडी या डायनामिक आईडी निकालने की जरूरत नहीं पड़ सकती है। यह कोड एक ही आईडी के साथ काम करता है।

संदर्भ लिंक

<label class="control-label col-sm-4">Check Box 2</label>
    <input type="checkbox" name="checkbox2" id="checkbox21" value=ck1 /> ck1<br />
    <input type="checkbox" name="checkbox2" id="checkbox22" value=ck2 /> ck2<br />

<label class="control-label col-sm-4">Check Box 3</label>
    <input type="checkbox" name="checkbox3" id="checkbox31" value=ck3 /> ck3<br />
    <input type="checkbox" name="checkbox3" id="checkbox32" value=ck4 /> ck4<br />

<script>
function checkFormData() {
    if (!$('input[name=checkbox2]:checked').length > 0) {
        document.getElementById("errMessage").innerHTML = "Check Box 2 can not be null";
        return false;
    }
    if (!$('input[name=checkbox3]:checked').length > 0) {
        document.getElementById("errMessage").innerHTML = "Check Box 3 can not be null";
        return false;
    }
    alert("Success");
    return true;
}
</script>

Comments

बुनियादी जानकारी: html तत्व आईडी दोहराए नहीं जाते हैं (जैसे: आईडी = "चेकबॉक्स 2", आईडी = "चेकबॉक्स 3")। यह एक अच्छा अभ्यास नहीं है। हम एक पृष्ठ में कई बार कक्षा का उपयोग कर सकते हैं।

— आनंद सोमशेखर

Answer 21

चूँकि यह 2019 के मध्य में है और jQuery कभी-कभी VueJS, React इत्यादि जैसी चीजों के लिए एक बैकसीट लेता है, यहाँ एक शुद्ध वेनिला जावास्क्रिप्ट ऑनलोड श्रोता विकल्प है:

<script>
  // Replace 'admincheckbox' both variable and ID with whatever suits.

  window.onload = function() {
    const admincheckbox = document.getElementById("admincheckbox");
    admincheckbox.addEventListener('click', function() {
      if(admincheckbox.checked){
        alert('Checked');
      } else {
        alert('Unchecked');
      }
    });
  }
</script>

Answer 22

आपका प्रश्न स्पष्ट नहीं है: आप इनपुट पर "चेकबॉक्स सरणी आईडी" देना चाहते हैं और true/falseआउटपुट पर प्राप्त करना चाहते हैं - इस तरह से आपको पता नहीं चलेगा कि कौन सा चेकबॉक्स चेक किया गया था (जैसा कि आपका फ़ंक्शन नाम सुझाव है)। इसलिए नीचे आपके शरीर का मेरा प्रस्ताव है isCheckedByIdजो इनपुट पर चेकबॉक्स idऔर आउटपुट रिटर्न पर ले जाता है true/false(यह बहुत सरल है लेकिन आपकी आईडी को कीवर्ड नहीं करना चाहिए),

this[id].checked

function isCheckedById(id) {
  return this[id].checked;
}

function check() {
  console.clear()
  console.log('1',isCheckedById("myCheckbox1"));
  console.log('2',isCheckedById("myCheckbox2"));
  console.log('3',isCheckedById("myCheckbox3"));
}

<label><input id="myCheckbox1" type="checkbox">check 1</label>
<label><input id="myCheckbox2" type="checkbox">check 2</label>
<label><input id="myCheckbox3" type="checkbox">check 3</label>
<!-- label around inputs makes text clickable -->
<br>
<button onclick="check()">show checked</button>

Answer 23

नीचे दिए गए कोड का उपयोग करें

<script>

$(document).ready(function () {
  $("[id$='chkSendMail']").attr("onchange", "ShowMailSection()");
}

function ShowMailSection() {
  if ($("[id$='chkSendMail'][type='checkbox']:checked").length >0){
      $("[id$='SecEmail']").removeClass("Hide");
  }
</script>

Comments

वास्तव में? कैसे के बारे में$(function() { $("[id$='chkSendMail']").on("change", ShowMailSection); });

— mplungjan

और वे सभी चेकबॉक्स हैं इसलिए $("[id$='chkSendMail']:checked]")ठीक काम करना चाहिए

— mplungjan