Bộ chọn checkbox
Bộ chọn :checkbox chọn
các hộp kiểm. Xem thẻ
checkbox.
Tương đương với $(':checkbox') là
$('[type=checkbox]').
Vì :checkbox không thuộc đặc tả CSS,
nên để cải thiện hiệu suất trong các trình duyệt
hiện đại, tốt hơn nên sử dụng
[type='checkbox'] thay cho nó.
Cú pháp
Chúng ta chọn các hộp kiểm như sau:
$(':checkbox');
Giống như với các bộ chọn lớp giả khác
(bắt đầu bằng ':'), tốt hơn nên đặt
tên thẻ hoặc bộ chọn khác trước ':', nếu không
thì bộ chọn '*' sẽ được áp dụng,
tức là $(':checkbox') sẽ được hiểu là
$('*:checkbox'), vì vậy thay vào đó tốt hơn
nên sử dụng $('input:checkbox').
Ví dụ
Hãy chọn tất cả các hộp kiểm, bọc chúng
bằng một span. Sau đó đặt nền màu xanh lá và
viền đỏ cho các span bằng phương thức
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(); // ngăn chặn việc gửi biểu mẫu
});
