Description
This technique demonstrates how to use the radio role and describes the effect it has on browsers and assistive technology.
Possible effects on user agents and assistive technology
Note: Opinons may differ on how assistive technology should handle this technique. The information provided above is one of those opinions and therefore not normative.
Examples
Example 1:
Example from the Basic form hints MDN page.
<h3 id="rg1_label">Lunch Options</h3> <ul class="radiogroup" id="rg1" role="radiogroup" aria-labelledby="rg1_label"> <li id="r1" tabindex="-1" role="radio" aria-checked="false"> <img role="presentation" src="radio-unchecked.gif" /> Thai </li> <li id="r2" tabindex="-1" role="radio" aria-checked="false"> <img role="presentation" src="radio-unchecked.gif" /> Subway </li> <li id="r3" tabindex="0" role="radio" aria-checked="true"> <img role="presentation" src="radio-checked.gif" /> Radio Maria </li> </ul>
Working Examples:
Notes
ARIA attributes used
Related ARIA techniques
Compatibility
TBD: Add support information for common UA and AT product combinations