[javascript] Impostando "checked" per una checkbox con jQuery?



Answers

Uso:

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

E se vuoi controllare se una casella di controllo è selezionata o meno:

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

Mi piacerebbe fare qualcosa di simile a spuntare una checkbox usando jQuery :

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

o

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

Esiste una cosa del genere?




Seleziona gli elementi che hanno l'attributo specificato con un valore contenente la sottostringa data:

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

Seleziona tutti gli elementi che contengono ckbItem nel suo attributo name.




In jQuery,

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

o

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

In JavaScript,

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



Questa è probabilmente la soluzione più breve e più semplice:

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

o

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

Ancora più breve sarebbe:

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

Ecco anche un jsFiddle .




Un'altra possibile soluzione:

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



Come @ livefree75 ha detto:

jQuery 1.5.xe sotto

Puoi anche estendere l'oggetto $ .fn con nuovi metodi:

(function($)  {
   $.fn.extend({
      check : function()  {
         return this.filter(":radio, :checkbox").attr("checked", true);
      },
      uncheck : function()  {
         return this.filter(":radio, :checkbox").removeAttr("checked");
      }
   });
}(jQuery));

Ma nelle nuove versioni di jQuery, dobbiamo usare qualcosa del genere:

jQuery 1.6+

    (function($)  {
       $.fn.extend({
          check : function()  {
             return this.filter(":radio, :checkbox").prop("checked", true);
          },
          uncheck : function()  {
             return this.filter(":radio, :checkbox").prop("checked",false);
          }
       });
    }(jQuery));

Quindi puoi semplicemente fare:

    $(":checkbox").check();
    $(":checkbox").uncheck();



Possiamo usare elementObject con jQuery per ottenere l'attributo controllato:

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

Possiamo usarlo per tutte le versioni di jQuery senza errori.

Aggiornamento: Jquery 1.6+ ha il nuovo metodo prop che sostituisce attr, ad esempio:

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



Quando hai spuntato una casella di controllo come;

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

potrebbe non essere abbastanza Dovresti anche chiamare la funzione qui sotto;

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

Soprattutto quando hai rimosso l'attributo checkbox check.




Ecco un modo per farlo senza 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>




Per controllare e deselezionare

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



Supponendo che la domanda sia ...

Come faccio a selezionare una casella di spunta impostata su VALORE?

Ricorda che in un tipico set di caselle di controllo, tutti i tag di input hanno lo stesso nome, differiscono in base al value dell'attributo : non ci sono ID per ogni input del set.

La risposta di Xian può essere estesa con un selettore più specifico , utilizzando la seguente riga di codice:

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



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

L'ultimo attiverà l'evento click per la casella di controllo, gli altri no. Pertanto, se hai un codice personalizzato nell'evento onclick per la casella di controllo che desideri attivare, utilizza l'ultimo.




Tu puoi fare

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

o

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

Se hai un codice personalizzato nell'evento onclick per la casella di controllo che desideri attivare, utilizza invece questo:

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

Puoi deselezionare rimuovendo completamente l'attributo:

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

Puoi selezionare tutte le caselle di controllo come questa:

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



Per jQuery 1.6+

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

Per jQuery 1.5.xe versioni successive

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

Controllare,

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



Ecco il codice per selezionato e deselezionato con un pulsante:

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;
    });
});

Aggiornamento: qui è lo stesso blocco di codice che utilizza il nuovo metodo prop Jquery 1.6+, che sostituisce 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;
    });
});





Related