Is hidden content bad for accessibility?

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, the change button is 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>

Does this kind of practice of hiding / displaying elements with CSS may be bad in terms of accessibility for example for blind users?

    
asked by anonymous 25.08.2016 / 19:26

1 answer

0

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

    
04.08.2017 / 22:27