checked სელექტორი

:checked სელექტორი ირჩევს ელემენტებს, რომლებიც არჩეულია, ანუ those, რომლებსაც აქვთ ატრიბუტები 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('არჩეულია: ' + 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() + ' არჩეულია!');
});

იხილეთ ასევე

მეთოდი filter,
რომელიც ფილტრავს ელემენტებს სეტში მოცემული სელექტორის მიხედვით
ატრიბუტი selected
სელექტორი selected,
რომელიც ირჩევს ელემენტებს, რომლებიც არჩეულია, ანუ those, რომლებსაც აქვთ ატრიბუტი selected
თეგები option, select, checkbox
და radio