Radio-selectorn

Selectorn :radio väljer radioknappar. Se taggen radio. Motsvarigheten till $(':radio') är $('[type=radio]'). Eftersom :radio inte ingår i CSS-specifikationen, är det bättre att använda [type='radio'] istället för bättre prestanda i moderna webbläsare.

Syntax

Så här väljer vi radioknappar:

javascript$(':radio');

Precis som med andra pseudo-klass-selectorer (som börjar med ':'), är det bättre att sätta ett taggnamn eller en annan selector före ':', annars används selectorn '*', dvs $(':radio') kommer att uppfattas som $('*:radio'), så istället är det bättre att använda $('input:radio'). För att välja relaterade radioknappar kan du använda $('input[name=gender]:radio').

Exempel

Låt oss välja radioknapparna, wrappa dem i ett span. Sedan ger vi span-elementen en grön bakgrund och en röd ram med metoden css:

html<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(); // förhindrar att formuläret skickas });

<

-javascript->

Se även

  • taggen radio
  • metoden filter,
    som filtrerar element i en uppsättning enligt en given selector
  • metoden find,
    som söker efter element inuti redan hittade element