Puslapyje turiu keletą įvesties teksto laukų ir jų reikšmes rodau naudodamas "JavaScript".
Naudoju .set("value","")
funkciją, kad galėčiau redaguoti reikšmę, pridėti papildomą žymės langelio lauką ir perduoti reikšmę.
Šiuo atveju noriu patikrinti, kad jei value == 1
, šis žymimasis langelis turėtų būti pažymėtas. Priešingu atveju jis turėtų likti nepažymėtas.
Tai padariau naudodamas du divus, bet man tai nepatinka, ar yra koks nors kitas sprendimas?
if(value == 1) {
$('#uncheck').hide();
$('#check').show();
} else{
$('#uncheck').show();
$('#check').hide();
}
JQuery 1.6+ :
.attr() nebenaudojama savybėms; vietoj jos naudokite naująją .prop() funkciją, nes:
$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it
Dėl jQuery < 1.6:
Jei norite pažymėti/atšaukti žymimąjį langelį, naudokite atributą checked
ir jį pakeiskite. Naudodami jQuery galite daryti:
$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it
Nes žinote, kad HTML kalba tai atrodytų maždaug taip:
<input type="checkbox" id="myCheckbox" checked="checked" /> <!-- Checked -->
<input type="checkbox" id="myCheckbox" /> <!-- Unchecked -->
Tačiau negalite pasitikėti .attr() metodu, kad gautumėte žymimojo langelio reikšmę (jei to reikia). Turėsite pasikliauti .prop() metodu.
Tam galite naudoti prop(), nes iki jQuery 1.6, .attr() metodas kartais atsižvelgdavo į savybių reikšmes, kai buvo gaunamos kai kurios savybės, ir tai galėjo sukelti nenuoseklų elgesį. Nuo jQuery 1.6** metodas .prop()
suteikia galimybę aiškiai gauti savybių vertes, o .attr()
- atributus.
var prop=false;
if(value == 1) {
prop=true;
}
$('#checkbox').prop('checked',prop);
arba tiesiog,
$('#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">