Estou desenvolvendo uma aplicação javascript que não ficou elegante.
Código HTML
<div style="text-align: center;">
<input type="button" id="plus" value='-' onclick="process1(-1)" />
<input id="quant1" name="entry.1772499230" class="produto" size="1" type="text" value="0" maxlength="5" />
<input type="button" id="minus" value='+' onclick="process1(1)">
</div>Na loja terá vários input id desse.
<div style="text-align: center;">
<input type="button" id="plus" value='-' onclick="process2(-1)" />
<input id="quant2" name="entry.1772499230" class="produto" size="1" type="text" value="0" maxlength="5" />
<input type="button" id="minus" value='+' onclick="process2(1)">
</div>Para exemplificar minha dúvida postei apenas 2 desses botões.
Os códigos javascript que interage com essas duas DIVs estão logo abaixo:
Script 1
<script>
function process1(quant1){
var value = parseInt(document.getElementById("quant1").value);
value+=quant1;
if(value < 0){
document.getElementById("quant1").value = 0;
}else{
document.getElementById("quant1").value = value;
}
}
</script>Script 2
<script>
function process2(quant2){
var value = parseInt(document.getElementById("quant2").value);
value+=quant2;
if(value < 0){
document.getElementById("quant2").value = 0;
}else{
document.getElementById("quant2").value = value;
}
}
</script>O problema é que pretendo criar na mesma página mais de 50 dessas DIVs e da forma que resolvi esse problema terei que criar mais de 50 desse script. Estou procurando uma forma de usar apenas um único código javascript e deixar meu código mais elegante.