Pemilih Checkbox
Pemilih :checkbox memilih
kotak centang. Lihat tag
checkbox.
Ekuivalen dari $(':checkbox') adalah
$('[type=checkbox]').
Karena :checkbox bukan bagian dari spesifikasi CSS,
maka untuk meningkatkan performa di browser
modern, lebih baik gunakan
[type='checkbox'] sebagai gantinya.
Sintaks
Ini cara kita memilih kotak centang:
$(':checkbox');
Seperti pemilih kelas semu lainnya
(dimulai dengan ':'), sebaiknya letakkan nama tag atau pemilih lain sebelum ':', jika
tidak, pemilih '*' akan diterapkan,
yaitu $(':checkbox') akan dianggap sebagai
$('*:checkbox'), oleh karena itu lebih baik
gunakan $('input:checkbox').
Contoh
Mari, pilih semua kotak centang, bungkus mereka
dalam span. Kemudian beri latar hijau dan
bingkai merah pada span menggunakan metode
css:
<form>
<input type="button" value="button">
<input type="file">
<input type="checkbox">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="checkbox">
<input type="text">
</form>
$('form input:checkbox')
.wrap('<span></span>')
.parent()
.css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // mencegah pengiriman formulir
});