Селектор 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->