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?