tarkista / poista valintaruutu jqueryn avulla?

Sivullani on joitakin tekstikenttiä, joiden arvot näytetään JavaScriptin avulla.

Käytän .set("value","")-funktiota arvon muokkaamiseen, ylimääräisen valintaruutukentän lisäämiseen ja arvon siirtämiseen.

Tässä haluan tarkistaa, että jos arvo == 1, tämä valintaruutu on valittuna. Muussa tapauksessa sen pitäisi pysyä valitsematta.

Tein tämän käyttämällä kahta diviä, mutta en tunne oloani mukavaksi sen kanssa, onko mitään muuta ratkaisua?

if(value == 1) {
    $('#uncheck').hide();
    $('#check').show();
} else{
    $('#uncheck').show();
    $('#check').hide();
}
Ratkaisu

JQuerylle 1.6+ :

.attr() on vanhentunut ominaisuuksien osalta; käytä sen sijaan uutta .prop() funktiota as:

$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it

JQuerylle < 1.6:

Jos haluat tarkistaa tai poistaa valintaruudun valinnan, käytä attribuuttia checked ja muuta sitä. JQueryllä voit tehdä näin:

$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it

Koska HTML:ssä se näyttäisi seuraavalta:

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

Et kuitenkaan voi luottaa siihen, että .attr()-metodilla saadaan valintaruudun arvo (jos se on tarpeen). Sinun on luotettava .prop()-metodiin.

Kommentit (16)

Voit käyttää prop() tähän, koska ennen jQuery 1.6, .attr() metodi otti joskus ominaisuuksien arvot huomioon hakiessaan joitakin attribuutteja, mikä saattoi aiheuttaa epäjohdonmukaista käytöstä. JQuery 1.6:sta lähtien .prop()-metodi tarjoaa tavan hakea nimenomaisesti ominaisuuksien arvot, kun taas .attr() hakee attribuutit.

var prop=false;
if(value == 1) {
   prop=true; 
}
$('#checkbox').prop('checked',prop);

tai yksinkertaisesti,

$('#checkbox').prop('checked',(value == 1));

Snippet

$(document).ready(function() {
  var chkbox = $('.customcheckbox');
  $(".customvalue").keyup(function() {
    chkbox.prop('checked', this.value==1);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h4>This is a domo to show check box is checked
if you enter value 1 else check box will be unchecked </h4>
Enter a value:
<input type="text" value="" class="customvalue">
<br>checkbox output :
<input type="checkbox" class="customcheckbox">
Kommentit (0)

Voit määrittää valintaruudun tilan arvon perusteella:

$('#your-checkbox').prop('checked', value == 1);
Kommentit (1)