checked selector
:checked selector သည်
ရွေးချယ်ထားသော အစိတ်အပိုင်းများကို
ရွေးချယ်ပေးပါသည်။ အထူးသဖြင့်
checked သို့မဟုတ်
selected attribute
ရှိသော အစိတ်အပိုင်းများဖြစ်သည်။
:checked selector သည် checkbox များ
(checkbox) နှင့်
radio button များ
(radio) အတွက်
လည်းကောင်း၊
option tag ပါသော
အစိတ်အပိုင်းများအတွက်လည်းကောင်း အသုံးပြုနိုင်ပါသည်။
select အစိတ်အပိုင်းများမှ
ရွေးချယ်ထားသော option များကိုသာ ရရှိရန်
selected selector ကို
အသုံးပြုပါ။
စာဖွဲ့သွားပုံ
ဤသို့ဖြင့် checked attribute ပါသော
အစိတ်အပိုင်းများကို ရွေးချယ်နိုင်ပါသည်။
$(':checked');
ဥပမာ
Checkbox တစ်ခုစီကို ရွေးချယ်သည့်အခါတိုင်း ရွေးချယ်ထားသော checkbox စုစုပေါင်း အရေအတွက်ကို ပြသပေးပါစို့။ သင့်ပထမဆုံး ကလစ်နှိပ်မှုမတိုင်မီ စံသတ်မှတ်ချက်အရ ရွေးချယ်ထားသော checkbox များ (ဒုတိယနှင့် စတုတ္ထ) များကို ပြသထားသည်ကို သင်တွေ့ရပါလိမ့်မည်။
<form>
<p>
<input type="checkbox" name="cbox" value="one">
<input type="checkbox" name="cbox" value="two" checked="checked">
<input type="checkbox" name="cbox" value="three">
<input type="checkbox" name="cbox" value="four" checked>
<input type="checkbox" name="cbox" value="five">
</p>
</form>
<div></div>
div {
color: green;
}
let countChecked = function() {
let n = $('input:checked').length;
$('div').text('Checked: ' + n);
};
countChecked();
$('input[type=checkbox]').on('click', countChecked);
ဥပမာ
ကလစ်နှိပ်လိုက်သည့်အခါ ရွေးချယ်ထားသော radio button တစ်ခုစီ၏ တန်ဖိုးကို အောက်တွင် ပြသပေးပါစို့။
<form>
<div>
<input type="radio" name="digits" value="one" id="one">
<label for="one">one</label>
</div>
<div>
<input type="radio" name="digits" value="two" id="two">
<label for="two">two</label>
</div>
<div>
<input type="radio" name="digits" value="three" id="three">
<label for="three">three</label>
</div>
<div id="text"></div>
</form>
input, label {
line-height: 1.5em;
}
$('input').on('click', function() {
$('#text').html($('input:checked').val() + ' is checked!');
});
