Почему скрытые элементы формы все еще читаются JAWS?

Question

Ситуация

У меня есть область экрана, который может быть представлен и скрытый с помощью JavaScript (что-то вроде «показать/скрыть дополнительные параметры поиска»). Внутри этой области есть элементы формы (select, checkbox и т. Д.). Для пользователей, использующих вспомогательные технологии, такие как экранный ридер (в данном случае JAWS), нам нужно связать эти элементы формы с меткой или использовать атрибут «title» для описания цели каждого элемента. Я использую атрибут title, потому что для ярлыка недостаточно места, и всплывающая подсказка, которую вы получаете, хороша для пользователей, не использующих экран.

код выглядит примерно так:

<div id="placeholder" style="display:none;"> 
    <select title="Month"> 
    <option>January</option> 
    <option>February</option> 
    ... 
    </select> 
</div> 

Проблема

Обычно, JAWS не будет читать скрытые элементы ... потому что хорошо, они скрыты и он знает, что. Однако кажется, что если элемент имеет набор заголовков, JAWS читает его независимо от того, что. Если я удалю заголовок, JAWS ничего не прочитает, но, очевидно, это доступная разметка.

Возможные решения

Моя первая мысль была использовать скрытую метку вместо названия, например:

<div id="placeholder" style="display:none;"> 
    <label for="month" style="display:none">Month</label> 
    <select id="month">...</select> 
</div> 

Это приводит к точно таким же поведением, и теперь мы теряем инструмент -tips для пользователей, не использующих экран. Также мы получаем в два раза больше Html.

Второй вариант по-прежнему использовать метку, положить положение ее с экрана. Таким образом, он будет прочитан чтения с экрана, но не будет видно зрительным пользователя:

<div id="placeholder" style="display:none;"> 
    <label for="month" style="position:absolute;left:-5000px:width:1px;">Month</label> 
    <select id="month">...</select> 
</div> 

Это на самом деле работает, но опять же мы теряем всплывающей подсказке и еще генерировать дополнительный Html.

Моя третья из возможных решений является рекурсивно путешествовать через DOM в JavaScript, удаляя заголовок, когда область скрыта и добавить его обратно, когда отображается область. Это также работает ... но по очевидным причинам довольно уродливо и не очень хорошо масштабируется в более общем случае.

Любые другие идеи кто-нибудь? Почему JAWS ведет себя так?

Answer 1

Это, безусловно, выглядит как ошибка в JAWS, как спецификация окончательно утверждает, что дисплей: никто не должен вызвать элемент и его дочерние элементы не будут отображаться в любых средствах массовой информации.

Однако, играя с говорят: слуховое свойство может быть полезным? Я не знаю, поскольку у меня нет JAWS.

http://www.w3.org/TR/CSS2/aural.html#speaking-props

Answer 2

вы пытаетесь ли это?

<div id="placeholder" style="display:none;"> 
    <select title="Month" style="speak:none;"> 
    <option>January</option> 
    <option>February</option> 
    ... 
    </select> 
</div> 

Это работает для меня в прошлом, когда я хотел сделать JAWS прочитать одну вещь, и пропустить что-то другое, что обычно можно прочитать.

Answer 3

Дайте вещи арии скрытое = «истинный» атрибут, и она должна быть скрыта от Экранный.