entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

3votos

como acumular digitos en un span

buenos dias mis colegas, soy nuevo en esto de la programacion, llevo un curso de javascript, mi tarea es crear una calculadora, el asunto es que llevo semanas intentado sin resulatados, ya que no puedo modificar el html previamente propocionado para realizar la tarea, todo el teclado, son imagenes, logre imprimir en el display los numeros, solo uno a la vez, y deben ser hasta 8 digitos, es lo unico que he podido, lo logre con un addEventListener. les dejo el html.

<body>
    <div class="fondo">
        <div class="titulo-container">
            <h1>¡No pierdas <span>la cuenta!</span></h1>
        </div>

        <div class="notas-container">
            <h2>Tus apuntes...</h2>
            <textarea class="nota-input" placeholder="Escribe aquí..."></textarea>
        </div>

        <div id="calculadoraFondo">
            <div class="pantalla">
                <span id="display">0</span>
            </div>

            <div class="teclado">
                <img src="image/ON.png" alt="On" class="tecla" id="on"/>
                <img src="image/sign.png" alt="signo" class="tecla" id="sign"/>
                <img src="image/raiz.png" alt="raiz" class="tecla" id="raiz"/>
                <img src="image/dividido.png" alt="dividido" class="tecla divide" id="dividido"/>

                <img src="image/7.png" alt="7" class="tecla" id="7"/>
                <img src="image/8.png" alt="8" class="tecla" id="8"/>
                <img src="image/9.png" alt="9" class="tecla" id="9"/>
                <img src="image/por.png" alt="por" class="tecla multiplica" id="por"/>

                <img src="image/4.png" alt="4" class="tecla" id="4"/>
                <img src="image/5.png" alt="5" class="tecla" id="5"/>
                <img src="image/6.png" alt="6" class="tecla" id="6"/>
                <img src="image/menos.png" alt="menos" class="tecla resta" id="menos"/>

                <div class="row">
                    <div class="col1">
                        <img src="image/1.png" alt="1" class="tecla" id="1"/>
                        <img src="image/2.png" alt="2" class="tecla" id="2"/>
                        <img src="image/3.png" alt="3" class="tecla" id="3"/>

                        <img src="image/0.png" alt="0" class="tecla" id="0"/>
                        <img src="image/punto.png" alt="punto" class="tecla" id="punto"/>
                        <img src="image/igual.png" alt="igual" class="tecla" id="igual"/>
                    </div>

                    <div class="col2">
                        <img src="image/mas.png" alt="mas" class="tecla suma" id="mas"/>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

0voto

Botxtrem-Solutions comentado

No miro nada de javascript solo html y algo de css . te recomiendo plantear bien tu pregunta para obtener una respuesta clara. saludes

0voto

Josmi comentado

el asunto es que no logro hacer nada con javascript, hice que se imprimieran los numeros en el display de la siguente manera document.getElementById("1").addEventListener("click",function(){document.getElementById("display").innerHTML="1";})

esto lo hice con todos los numeros, el asunto es que no logro hacer que se acumulen en el display es decir que al precionar las teclas 1 y 2 se colo el numero 12, solo me imprime uno a la vez, si me explico?

1 Respuesta

4votos

FelipeMedel Puntos7400

aquí tienes una solución, claro esta, no es con tu código, pero te sirve como guía para que soluciones tu inquietud.

<!DOCTYPE html>
<html>
    <head>
        <title>valor span</title>
    </head>
    <script type="text/javascript">
        function agregarValor(){
            // capturas el valor del span
            var valorSpan = document.getElementById('resultado').innerHTML;
            // capturas el valor de lo que vas a ingresar
            var valorInput = document.getElementById('valor').value;
            //seteas el valor inicial + el nuevo
            document.getElementById('resultado').innerHTML = valorSpan + valorInput;
        }
    </script>
    <body>
        <center>
            <input type="text" id="valor" placeholder="Ingrese Valor">
            <br>
            <button onclick="agregarValor()">Agregar Valor</button>
            <br>
            <span id="resultado">prueba</span>
        </center>

    </body>
</html>

y en el resultado seria algo así:

por defecto le agregue un valor "prueba"
span1
ahora lo que hacemos es agregar un nuevo valor para que se agregue al anterior.
span2
y el resultado seria algo como esto...
span3
espero te sirva...

0voto

Josmi comentado

Muchas gracias, lo intentare.

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta