jQuery on Javascript framework, joka voi yksinkertaistaa koodaus Javascript verkkosivuilla ja poistaa paljon cross browser yhteensopivuusongelmia. Eilen katsoin miten saada ja asettaa lomakkeen elementin arvot jQuery mutta ei käsitellä valintaruudut. Tänään post tarkastellaan, miten kertoa, jos HTML-lomakkeen valintaruutu on valittu tai ei tarkistettu jQuery ja sitten miten muuttaa se on un / checked.
Esimerkkilomake
esimerkkilomake näyttää tältä:
<input type="checkbox" name="foo" value="bar" /><input type="button" onclick="show_checked()" value="Show" /><input type="button" onclick="set_checked(true)" value="On" /><input type="button" onclick="set_checked(false)" value="Off" />
on valintaruutu nimi ” foo ” ja sitten kolme painiketta. Ensimmäinen kutsuu funktion, joka näyttää meille, onko valintaruutu valittu vai ei, ja kaksi jälkimmäistä muuttavat sen tarkistamisesta ei tarkistettavaksi.
jos valintaruutu on valittuna
on useita tapoja saada selville, onko valintaruutu valittuna vai ei jqueryllä, ja tässä pari vaihtoehtoa. Jokainen palauttaa true jos se on valittu tai false jos se ei ole.
$('input').is(':checked')$('input').attr('checked')
Aseta valintaruutu valituksi tai ei valituksi
valintaruudun tilaa voidaan muuttaa käyttämällä attr () – toimintoa näin, Jos haluat valintaruudun:
$('input').attr('checked', true);
ja näin poistaa ruudun:
$('input').attr('checked', false);
Working example
And finally, here ’ s the example form in action:
huomautus Boolen arvoista
alla olevissa kommenteissa on keskustelu kromia sisältävistä ongelmista, jotka voivat liittyä True-Ja false-arvoihin, kun taas sen on oltava ehdottomasti Boolen tosi tai epätosi muuten odottamattomia seurauksia voi tapahtua.
sitä on ehdotettu käytettäväksi .removeAttr () sen sijaan, mutta tämä voi olla muita seurauksia minun käsittelyssä kommentteja jQuery dokumentaatio sivulla funktio. I will follow up this post at a later date and do more testing to confirm for sure
Toggling a checkbox when clicking a label
Note that Javascript is not required to toggle a checkbox when clicking some text; that ’ s what HTML <label>s are for. Voit lukea seurantapostaukseni HTML <label> avulla vaihtaaksesi ja valitaksesi kenttiä saadaksesi lisätietoja.