Checkbox z inputem -aria

0

Czy ktoś z was wie lub ma przykład jak powinien wyglądać poprawny pod względem accessibility checkbox który jeśli jest zaznaczony to wysuwa się (accordion) input i można wpisać wartość checkboxa?

[X] other checbkox
[ input placeholder ... ]

1

Takie coś

<label for="toggle">Toggle</label>
<input aria-expanded="false" aria-controls="panel" name="togglename" type="checkbox" id="toggle" />

<div id="panel">
  <label for="text">Text</label>
  <input name="textname" type="text" id="text" />
</div>

aria-expanded przełączasz true/false javascriptem.

Parę uwag.
W obecnej specyfikacji ARIA 1.1 z 2017 roku, checkbox (w teorii) nie może mieć aria-expanded. Ale większość czytników mimo to rozumie taki zapis.
W nowej specyfikacji ARIA 1.2, która na razie jest preview, taka konstrukcja już będzie dozwolona.

Poczytaj sobie tutaj. To jest niby o type="radio" (aria-expanded dla nich ma przyjść ARIA 1.3), ale też napisali o checkboxach.

A tutaj masz przykład jak to zrobili w systemie designu dla stron rządu brytyjskiego.

1 użytkowników online, w tym zalogowanych: 0, gości: 1