Bộ chọn radio
Bộ chọn :radio chọn các nút
chuyển đổi radio. Xem thẻ
radio.
Tương đương với $(':radio') là
$('[type=radio]').
Vì :radio 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 dùng [type='radio']
thay thế nó.
Cú pháp
Chúng ta chọn các nút radio như sau:
$(':radio');
Giống như với các bộ chọn lớp giả khác
(bắt đầu bằng ':'), trước ':' tốt hơn
nên đặt tên thẻ hoặc bộ chọn khác, nếu
không, bộ chọn '*' sẽ được áp dụng,
tức là $(':radio') sẽ được hiểu là
$('*:radio'), do đó thay vào đó nên
sử dụng $('input:radio').
Để chọn các nút chuyển đổi radio liên quan có thể
sử dụng $('input[name=gender]:radio').
Ví dụ
Hãy chọn các nút chuyển đổi radio, bọc chúng
lại trong một span. Sau đó làm cho các span có nền màu xanh lá cây và
viền màu đỏ bằng phương thức
css:
<form>
<input type="button" value="button">
<input type="file">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="text">
</form>
<+javascript+>
$('form input:radio')
.wrap('')
.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
});
<-javascript->
