Incrementar e decrementar um valor
Permite alterar em vários inputs
by Tiago Agostinho
HTML
<div>
<a href="#" onclick="decrementaValor(0, 'resultado1'); return false;">-</a>
<input name="resultado" id="resultado1" value="1">
<a href="#" onclick="incrementaValor(10, 'resultado1');return false;">+</a>
</div>
<div>
<a href="#" onclick="decrementaValor(0, 'resultado2'); return false;">-</a>
<input name="resultado" id="resultado2" value="1">
<a href="#" onclick="incrementaValor(10, 'resultado2');return false;">+</a>
</div>
<div>
<a href="#" onclick="decrementaValor(0, 'resultado3'); return false;">-</a>
<input name="resultado" id="resultado3" value="1">
<a href="#" onclick="incrementaValor(10, 'resultado3');return false;">+</a>
</div>
CSS
a{
text-decoration: none;
font-size: 20px;
font-weight: bold;
padding: 10px;
}
input{
text-align: center;
width: 50px;
}
JavaScript
function incrementaValor(valorMaximo, id){
var value = parseInt(document.getElementById(id).value,10);
value = isNaN(value) ? 0 : value;
if(value >= valorMaximo) {
value = valorMaximo;
}else{
value++;
}
document.getElementById(id).value = value;
}
function decrementaValor(valorMinimo, id){
var value = parseInt(document.getElementById(id).value,10);
value = isNaN(value) ? 0 : value;
if(value <= valorMinimo) {
value = 0;
}else{
value--;
}
document.getElementById(id).value = value;
}