2

Buenas estoy haciendo una calculadora común mediante botones en JS, tengo este html:

 <li>
            <input id="uno" type="button" value="1" class="numero" >
        </li>
        <li>
            <input id="dos" type="button" value="2" class="numero" >
        </li>
        <li>
            <input id="tres" type="button" value="3" class="numero" >
        </li>

Y en el script tengo esto:

   document.getElementsByClassName('numero').onclick = añadirCuenta(numero.value)



    function añadirCuenta(valor) {
        cuentaTexto += valor
        document.getElementById('mostrador-cuenta').innerHTML = cuentaTexto;
    }

La función no es el problema si mando el argumento desde el html y onclick. Pero no sé, o no consigo entender como se hace llamando el evento desde el script, llamando a la clase, y que se cargue el "value" como parámetro para llamar la función.

Gracias de antemano.

0

1 respuesta 1

1

Yo lo haría así:

lista = document.getElementById('lista');

lista.addEventListener("click", function() {
  if (event.target.classList.contains("numero")) {
    añadirCuenta(event.target.value)
  }
})

var cuentaTexto = ''

function añadirCuenta(valor) {
  cuentaTexto += valor
  document.getElementById('mostrador-cuenta').innerHTML = cuentaTexto;
}
<div id="lista">
  <li>
    <input id="uno" type="button" value="1" class="numero">
  </li>
  <li>
    <input id="dos" type="button" value="2" class="numero">
  </li>
  <li>
    <input id="tres" type="button" value="3" class="numero">
  </li>
</div>
<div id="mostrador-cuenta"></div>

Donde encerramos todos los campos input en un solo div, al cual le ponemos el id lista, que ponemos a la escucha del evento click mediante el método addEventListener(), y si el botón pulsado tiene la clase numero entonces lanzamos la función añadirCuenta con el valor de dicho input, el cual identificamos con event.target.value donde event.target identifica al elemento pulsando en el evento, y value es su atributo.

Luego, dentro de la función, en la variable cuentaTexto le concatenamos el valor del botón pulsado.

Para luego, finalmente, mostrarlo en el div con id mostrador-cuenta con el innerHTML.

3
  • 1
    Creo que quiere concatenar los números, no sumarlos: pulsando 1,2 y 3 debería mostrar '123', como en una calculadora. Por lo demás, me parece una buena solución el 29 nov. 2022 a las 10:56
  • @PabloLozano ah, vaya, mmm... seguramente tienes razon... voy a quitar los parseInt entonces, gracias!
    – masterguru
    el 29 nov. 2022 a las 11:00
  • 1
    @PabloLozano llevaba razón, quité el parse cuando me dí cuenta, gracias a los dos!
    – MrWasu
    el 30 nov. 2022 a las 8:08

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.