Селектор checked
Селектор :checked бира елементе,
који су изабрани, односно оне који имају атрибуте
checked или
selected.
Селектор :checked ради са пољима за потврду
(checkbox) и
радио дугмадима
(radio),
као и са елементима са ознаком
option.
Да бисте добили само изабране опције елемената
select,
користите селектор
selected.
Синтакса
Овако бирамо елементе са
атрибутом checked:
$(':checked');
Пример
Хајде да, при сваком избору поља за потврду, прикажемо број изабраних поља за потврду. Као што видите, пре вашег првог клика биће приказана поља за потврду, изабрана подразумевано, то су друго и четврто:
<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);
Пример
Хајде да при клику приказујемо доле вредност сваког изабраног радио дугмета:
<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!');
});
