id identificar funcion de script js para que un input la ejecute

[jearj]

Tengo este script que he duplicado:

<script>
function inc_count(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)+1;
}
</script>


-----------------duplicado +2:
<script>
function inc_count(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)+2;
}
</script>


------------------duplicado -1:
<script>
function inc_count(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)-1;
}
</script>


<form action="" method="">
<input class="Marcador1" type="text" value="0" id="1" size="9"/>
</form>
<div id="column_top1">
<input class="Boton1" Name="a" type=button value=1 onclick="javascript:inc_count('1');">

<input class="Boton1" Name="b" type=button value=2 onclick="javascript:inc_count('1');">



<input class="Boton1" Name="c" type=button value=-1 onclick="javascript:inc_count('1');">




Lo que quiero es que cada input utilice su script.
Hace días que estoy con ello y no veo la manera de que el input se ejecute la función que quiero.

La función es que los input button, sume o reste un valor al input text.

Espero que sea posible y que alguien me pueda ayudar.

Un Saludo.

Muchas gracias por leerme.

[ZedGe1505]

Primero que nada, no puedes tener 3 funciones llamadas de igual manera... al menos deberías pasarle una cantidad de parámetros distintos...

Segundo, puedes usar la etiqueta ID en los input y luego en js obtener ese ID Algo así

Tercero.. para usar onclick basta solo con que pongas

Código Javascript:

onclick="inc_count1('1');"
 

Tu código quedaría así:

Código HTML:

<form action="" method="">
<input class="Marcador1" type="text" value="0" id="1" size="9"/>
</form>
<div id="column_top1">
<input class="Boton1" Name="a" type=button value=1 onclick="inc_count1('1');">
 
<input class="Boton1" Name="b" type=button value=2 onclick="inc_count2('1');">
 
<input class="Boton1" Name="c" type=button value=-1 onclick="inc_count3('1');">
 

Código Javascript:

function inc_count1(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)+1;
}
 
function inc_count2(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)+2;
}
 
function inc_count3(id)
{
res = document.getElementById(id);
res.value = parseInt(res.value)-1;
}
 

[jearj]

Muchas gracias ZedGe1505.

Me has salvado

Tu modificación funciona perfectamente, por eso os admiro tanto a los de este foro
La verdad que yo aun estoy muy verde con los .js intentare ponerle mas atención.

Un Saludo a todos.

[Alexis88]

Cuando tengas varias funciones que ejecuten instrucciones similares, trata de abstraerlas en una sola función:

Código Javascript:

function inc_count(id, x){
    var res = document.getElementById(id);
    switch (x){
        case 1:
            res.value = parseInt(res.value) + 1;
            break;
        case 2:
            res.value = parseInt(res.value) + 2;
            break;
        case 3:
            res.value = parseInt(res.value) - 1;
            break;
    }
    res.value = parseInt(res.value)+1;
}
 

Y cuando invoques a la función en cada elemento:

Código HTML:

<input class="Boton1" name="a" type="button" value="1" onclick="inc_count('1', 1)" />
<input class="Boton1" name="b" type="button" value="2" onclick="inc_count('1', 2)" />
<input class="Boton1" name="c" type="button" value="-1" onclick="inc_count('1', 3)" />
 

Y, como consejo final, cuando trabajes con JavaScript, procura hacerlo en un archivo JS externo y no inline, es decir, incrustado en los elementos HTML.

¿Cómo podrías hacer eso?

Código HTML:

<input class="Boton1" name="a" type="button" value="1" data-x="1" />
<input class="Boton1" name="b" type="button" value="2" data-x="2" />
<input class="Boton1" name="c" type="button" value="-1" data-x="3" />
 

Código Javascript:

document.addEventListener("DOMContentLoaded", function(){
    function inc_count(id, x){
        var res = document.getElementById(id);
        switch (x){
            case 1:
                res.value = parseInt(res.value) + 1;
                break;
            case 2:
                res.value = parseInt(res.value) + 2;
                break;
            case 3:
                res.value = parseInt(res.value) - 1;
                break;
        }
        res.value = parseInt(res.value)+1;
    }
 
    this.addEventListener("click", function(event){
        if (event.target.className == "Boton1"){
            inc_count("1", event.target.dataset.x);
        }
    }, false);
}, false);
 

El código JS se ejecutará una vez que el documento haya cargado. Cuando se detecte un clic en el mismo, se verificará que el elemento directamente afectado por el clic posea como clase al valor "Boton1"; de ser así, se realizará la llamada a la función "inc_count()", pasándole como argumentos el identificador del elemento de salida y el valor del atributo personalizado "x" que añadí a cada botón y en donde se especifica el caso a llevar a cabo.

Un saludo