Selektor checked
Selektor :checked secilmis elementləri seçir,
yəni checked və ya
selected atributlarına malik olanları.
Selektor :checked qutucuqlarla
(checkbox) və
radio düymələrlə
(radio) işləyir,
həmçinin option teqinə malik elementlərlə də.
select elementlərinin yalnız secilmiş opsiyalarını almaq üçün
selected selektorundan istifadə edin.
Sintaksis
Beləliklə, biz checked atributuna malik elementləri seçirik:
$(':checked');
Nümunə
Gəlin hər bir qutucuq seçildikdə, secilmiş qutucuqların sayını göstərək. Gördüyünüz kimi, ilk klikinizdən əvvəl standart olaraq secilmiş qutucuqlar göstəriləcək, bu da ikinci və dördüncüdür:
<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);
Nümunə
Gəlin klik zamanı aşağıda hər bir secilmiş radio düyməsinin dəyərini göstərək:
<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!');
});
