javascript - JQuery के साथ चेकबॉक्स के लिए "चेक किया गया" सेट करना?





checkbox selected checked (25)


Internet Explorer 9 से पहले इंटरनेट एक्सप्लोरर में मेमोरी लीक के बारे में जागरूक रहें, क्योंकि api.jquery.com/prop :

संस्करण 9 से पहले इंटरनेट एक्सप्लोरर में, एक सामान्य आदिम मूल्य (संख्या, स्ट्रिंग, या बूलियन) के अलावा किसी अन्य चीज़ पर किसी DOM तत्व प्रॉपर्टी को सेट करने के लिए .prop () का उपयोग करके संपत्ति को हटाया नहीं जाता है (.removeProp ( )) दस्तावेज़ से डीओएम तत्व हटा दिए जाने से पहले। मेमोरी लीक के बिना डीओएम ऑब्जेक्ट्स पर मूल्यों को सुरक्षित रूप से सेट करने के लिए, .data () का उपयोग करें।

मैं jQuery का उपयोग कर checkbox करने के लिए ऐसा कुछ करना चाहता हूं:

$(".myCheckBox").checked(true);

या

$(".myCheckBox").selected(true);

क्या ऐसी किसी वस्तु का अस्तित्व है?




एक चेकबॉक्स जांचने के लिए आपको उपयोग करना चाहिए

 $('.myCheckbox').attr('checked',true);

या

 $('.myCheckbox').attr('checked','checked');

और एक चेक बॉक्स को अनचेक करने के लिए आपको इसे हमेशा गलत पर सेट करना चाहिए:

 $('.myCheckbox').attr('checked',false);

यदि तुम करो

  $('.myCheckbox').removeAttr('checked')

यह विशेषता को एक साथ हटा देता है और इसलिए आप फॉर्म को रीसेट करने में सक्षम नहीं होंगे।

बादा डेमो jQuery 1.6 । मुझे लगता है कि यह टूटा हुआ है। 1.6 के लिए मैं उस पर एक नई पोस्ट करने जा रहा हूं।

नई वर्किंग डेमो jQuery 1.5.2 क्रोम में काम करता है।

दोनों डेमो का उपयोग करें

$('#tc').click(function() {
    if ( $('#myCheckbox').attr('checked')) {
        $('#myCheckbox').attr('checked', false);
    } else {
        $('#myCheckbox').attr('checked', 'checked');
    }
});



हम गुण की जांच के लिए jQuery के साथ elementObject उपयोग कर सकते हैं:

$(objectElement).attr('checked');

हम बिना किसी त्रुटि के सभी jQuery संस्करणों के लिए इसका उपयोग कर सकते हैं।

अद्यतन: Jquery 1.6+ में नई प्रोप विधि है जो attr को प्रतिस्थापित करती है, उदाहरण के लिए:

$(objectElement).prop('checked');



यह उन तत्वों का चयन करता है जिनमें दिए गए सबस्ट्रिंग "ckbItem" वाले मान के साथ निर्दिष्ट विशेषता है:

$('input[name *= ckbItem]').prop('checked', true);

यह उन सभी तत्वों का चयन करेगा जिनमें ckbItem को इसके नाम विशेषता में शामिल किया गया है।




सादा जावास्क्रिप्ट बहुत सरल और बहुत कम ओवरहेड है:

var elements = document.getElementsByClassName('myCheckBox');
for(var i = 0; i < elements.length; i++)
{
    elements[i].checked = true;
}

यहां उदाहरण




यह शायद सबसे छोटा और आसान समाधान है:

$(".myCheckBox")[0].checked = true;

या

$(".myCheckBox")[0].checked = false;

यहां तक ​​कि छोटा होगा:

$(".myCheckBox")[0].checked = !0;
$(".myCheckBox")[0].checked = !1;

यहां एक jsFiddle भी है।




एकाधिक चेक बॉक्स को जांचने के लिए कोड और डेमो यहां दिया गया है ...

http://jsfiddle.net/tamilmani/z8TTt/

$("#check").on("click", function () {

    var chk = document.getElementById('check').checked;
    var arr = document.getElementsByTagName("input");

    if (chk) {
        for (var i in arr) {
            if (arr[i].name == 'check') arr[i].checked = true;
        }
    } else {
        for (var i in arr) {
            if (arr[i].name == 'check') arr[i].checked = false;
        }
    }
});



उपयोग:

$(".myCheckbox").attr('checked', true); // Deprecated
$(".myCheckbox").prop('checked', true);

और यदि आप जांचना चाहते हैं कि चेकबॉक्स चेक किया गया है या नहीं:

$('.myCheckbox').is(':checked');



JQuery में,

if($("#checkboxId").is(':checked')){
    alert("Checked");
}

या

if($("#checkboxId").attr('checked')==true){
    alert("Checked");
}

जावास्क्रिप्ट में,

if (document.getElementById("checkboxID").checked){
    alert("Checked");
}



मुझे समाधान याद आ रहा है। मैं हमेशा उपयोग करूंगा:

if ($('#myCheckBox:checked').val() !== undefined)
{
    //Checked
}
else
{
    //Not checked
}



तुम कर सकते हो

$('.myCheckbox').attr('checked',true) //Standards compliant

या

$("form #mycheckbox").attr('checked', true)

यदि आपके पास उस चेकबॉक्स के लिए ऑनक्लिक ईवेंट में कस्टम कोड है जिसे आप आग लगाना चाहते हैं, तो इसके बजाय इसका उपयोग करें:

$("#mycheckbox").click();

आप पूरी तरह से विशेषता को हटाकर अनचेक कर सकते हैं:

$('.myCheckbox').removeAttr('checked')

आप इस तरह के सभी चेकबॉक्स देख सकते हैं:

$(".myCheckbox").each(function(){
    $("#mycheckbox").click()
});



JQuery के बिना इसे करने का एक तरीका यहां है

function addOrAttachListener(el, type, listener, useCapture) {
  if (el.addEventListener) {
    el.addEventListener(type, listener, useCapture);
  } else if (el.attachEvent) {
    el.attachEvent("on" + type, listener);
  }
};

addOrAttachListener(window, "load", function() {
  var cbElem = document.getElementById("cb");
  var rcbElem = document.getElementById("rcb");
  addOrAttachListener(cbElem, "click", function() {
    rcbElem.checked = cbElem.checked;
  }, false);
}, false);
<label>Click Me!
  <input id="cb" type="checkbox" />
</label>
<label>Reflection:
  <input id="rcb" type="checkbox" />
</label>




JQuery के साथ चेकबॉक्स को जांचने और अनचेक करने का यह सही तरीका है, क्योंकि यह क्रॉस-प्लेटफ़ॉर्म मानक है, और फ़ॉर्म रिपोस्ट की अनुमति देगा।

$('.myCheckBox').each(function(){ this.checked = true; });

$('.myCheckBox').each(function(){ this.checked = false; });

ऐसा करके, आप चेकबॉक्स को चेक और अनचेक करने के लिए जावास्क्रिप्ट मानकों का उपयोग कर रहे हैं, इसलिए कोई भी ब्राउज़र जो चेकबॉक्स तत्व की "चेक" संपत्ति को सही ढंग से लागू करता है, इस कोड को बेकार ढंग से चलाएगा। यह सभी प्रमुख ब्राउज़र होना चाहिए , लेकिन मैं पिछले इंटरनेट एक्सप्लोरर 9 का परीक्षण करने में असमर्थ हूं।

समस्या (jQuery 1.6):

एक बार जब उपयोगकर्ता चेकबॉक्स पर क्लिक करता है, तो वह चेकबॉक्स "चेक किए गए" विशेषता परिवर्तनों का जवाब देना बंद कर देता है।

किसी ने चेकबॉक्स पर क्लिक करने के बाद नौकरी करने में विफल होने वाले चेकबॉक्स विशेषता का एक उदाहरण दिया है (यह क्रोम में होता है)।

Fiddle

समाधान:

DOM तत्वों पर जावास्क्रिप्ट की "चेक" संपत्ति का उपयोग करके, हम डीओएम को ऐसा करने में करने की कोशिश करने के बजाय सीधे समस्या को हल करने में सक्षम हैं, जिसे हम करना चाहते हैं।

Fiddle

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

(function( $ ) {
    $.fn.checked = function(value) {
        if(value === true || value === false) {
            // Set the value of the checkbox
            $(this).each(function(){ this.checked = value; });
        } 
        else if(value === undefined || value === 'toggle') {
            // Toggle the checkbox
            $(this).each(function(){ this.checked = !this.checked; });
        }

        return this;
    };
})( jQuery );

वैकल्पिक रूप से, यदि आप प्लगइन का उपयोग नहीं करना चाहते हैं, तो आप निम्न कोड स्निपेट का उपयोग कर सकते हैं:

// Check
$(':checkbox').prop('checked', true);

// Un-check
$(':checkbox').prop('checked', false);

// Toggle
$(':checkbox').prop('checked', function (i, value) {
    return !value;
});



JQuery 1.6+ के लिए

$('.myCheckbox').prop('checked', true);
$('.myCheckbox').prop('checked', false);

JQuery 1.5.x और नीचे के लिए

$('.myCheckbox').attr('checked', true);
$('.myCheckbox').attr('checked', false);

जाँच करने के लिए,

$('.myCheckbox').removeAttr('checked');



इसे इस्तेमाल करे:

$('#checkboxid').get(0).checked = true;  //For checking

$('#checkboxid').get(0).checked = false; //For unchecking



जांचने और अनचेक करने के लिए

$('.myCheckbox').prop('checked', true);
$('.myCheckbox').prop('checked', false);



जब आपने चेकबॉक्स चेक किया था;

$('.className').attr('checked', 'checked')

यह पर्याप्त नहीं हो सकता है। आपको नीचे दिए गए फ़ंक्शन को भी कॉल करना चाहिए;

$('.className').prop('checked', 'true')

खासकर जब आपने चेकबॉक्स चेक किए गए गुण को हटा दिया।




JQuery का उपयोग कर पूरा जवाब यहां दिया गया है

मैं इसका परीक्षण करता हूं और यह 100% काम करता है: डी

    // when the button (select_unit_button) is clicked it returns all the checed checkboxes values 
    $("#select_unit_button").on("click", function(e){

             var arr = [];

             $(':checkbox:checked').each(function(i){
                 arr[i] = $(this).val(); // u can get id or anything else
             });

              //console.log(arr); // u can test it using this in google chrome
    });



मान लीजिए कि सवाल है ...

मैं चेकबॉक्स-सेट VALUE द्वारा कैसे सेट करूं?

याद रखें कि एक सामान्य चेकबॉक्स सेट में, सभी इनपुट टैगों का एक ही नाम होता है, वे विशेषता value भिन्न होते हैं: सेट के प्रत्येक इनपुट के लिए कोई आईडी नहीं होती है।

कोड की निम्न पंक्ति का उपयोग करते हुए जियान का उत्तर एक और विशिष्ट चयनकर्ता के साथ बढ़ाया जा सकता है:

$("input.myclass[name='myname'][value='the_value']").prop("checked", true);



यहां एक बटन के साथ चेक और अनचेक करने के लिए कोड है:

var set=1;
var unset=0;
jQuery( function() {
    $( '.checkAll' ).live('click', function() {
        $( '.cb-element' ).each(function () {
            if(set==1){ $( '.cb-element' ).attr('checked', true) unset=0; }
            if(set==0){ $( '.cb-element' ).attr('checked', false); unset=1; }
        });
        set=unset;
    });
});

अद्यतन: यहां नई Jquery 1.6+ प्रोप विधि का उपयोग करके एक ही कोड ब्लॉक है, जो attr को प्रतिस्थापित करता है:

var set=1;
var unset=0;
jQuery( function() {
    $( '.checkAll' ).live('click', function() {
        $( '.cb-element' ).each(function () {
            if(set==1){ $( '.cb-element' ).prop('checked', true) unset=0; }
            if(set==0){ $( '.cb-element' ).prop('checked', false); unset=1; }
        });
        set=unset;
    });
});



$('controlCheckBox').click(function(){
    var temp = $(this).prop('checked');
    $('controlledCheckBoxes').prop('checked', temp);
});



यदि मोबाइल का उपयोग करना है और आप इंटरफ़ेस को अपडेट करना चाहते हैं और चेकबॉक्स को अनचेक के रूप में दिखाना चाहते हैं, तो निम्न का उपयोग करें:

$("#checkbox1").prop('checked', false).checkboxradio("refresh");



एक और संभावित समाधान:

    var c = $("#checkboxid");
    if (c.is(":checked")) {
         $('#checkboxid').prop('checked', false);
    } else {
         $('#checkboxid').prop('checked', true);
    }



$("#mycheckbox")[0].checked = true;
$("#mycheckbox").attr('checked', true);
$("#mycheckbox").click();

आखिरी व्यक्ति चेकबॉक्स के लिए क्लिक इवेंट को फायर करेगा, अन्य लोग नहीं करेंगे। तो यदि आपके पास उस चेकबॉक्स के लिए ऑनक्लिक ईवेंट में कस्टम कोड है जिसे आप आग लगाना चाहते हैं, तो अंतिम का उपयोग करें।




This was a good https://.com/a/11810957/185565 poor man's solution. One comment considered a counter to bail out in case of emergency. This is my modification.

function doTheMagic(counter) {
  alert("It worked on " + counter);
}

// wait for document ready then call handler function
var checkLoad = function(counter) {
  counter++;
  if (document.readyState != "complete" && counter<1000) {
    var fn = function() { checkLoad(counter); };
    setTimeout(fn,10);
  } else doTheMagic(counter);
};
checkLoad(0);




javascript jquery checkbox selected checked