Селектор radio
Селектор :radio
выбирает радио
переключатели. Смотрите тег
radio
.
Эквивалентом $(':radio')
является
$('[type=radio]')
.
Так как :radio
не относится к CSS спецификации,
то для улучшения производительности в современных
браузерах вместо него лучше применить [type='radio']
.
Синтаксис
Так мы выбираем радиокнопки:
$(':radio');
Как и с другими селекторами псевдо-классами
(начинающимися с ':'
), перед ':'
лучше
поставить название тега или другого селектора, в
противном случае будет применен селектор '*'
,
то есть $(':radio')
будет восприниматься как
$('*:radio')
, поэтому вместо этого лучше
использовать $('input:radio')
.
Для выбора связанных радио переключателей можно
использовать $('input[name=gender]:radio')
.
Пример
Давайте, выберем радио переключатели, обернем их
в спан. Затем сделаем спанам зеленый фон и
красную рамку с помощью метода
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(); // предотвращает отправку формы
});
<-javascript->