Is hidden content bad for accessibility?

Asked

Viewed 50 times

2

I have a table with three columns, one for "Species", one for "Quantity" and one for options. The quantity field can be changed when the change button is clicked, with the change button hidden to show the save button.

<table class="table">
    ....
    <tr>
       <td>Espécie 1 </td>
       <td>
          <span id="sQtde_1">10 </span>
          <input type="text" id="txtQtde_1" value"10" class="form-control hide">
       </td>
       <td>
         <button type="button" value="1" class="btn">Alterar</button>
         <button type="button" id="btnSalvar_1" value="1" class="btn hide">Salvar</button>
       </td>
    </tr>
</table>

<script>
    function alterar(botao) {
      var n = $(botao).val();
      $("#txtQtde_" + n).toggleClass('hide');
      $("#sQtde_" + n).toggleClass('hide');
      $("#btnSalvar_" + n).toggleClass('hide');
      $(button).toggleClass('hide');
    }
</script>

This type of practice of hiding/showing elements with CSS can be bad when it comes to accessibility for blind users, for example?

jquery html accessibility

1 answer

0

Hidden elements (style="display:none;" and <input type="hidden">) not read by screen readers like NVDA and JAWS, screen readers ignore these types of elements.

Browser other questions tagged jquery html accessibility

You are not signed in. Login or sign up in order to post.