0

Muy buenas tardes. Mi pregunta es en relacion a js basico, estoy aprendiendo a programar y me he topado con una gran problematica por falta de conocimientos;

Tengo la tipica card de un carrito de compras en donde al hacer click en un boton suma +1 a la cantidad y a hacer click en otro boton suma -1. he logrado que los botones funcionen de manera correcta con funciones basicas, ahora necesito tomar el valor actual de la cantidad de productos y mutiplicarlo por un valor fijo (declarado en una const) y que muestre el "valor total" en otro parrafo creado en el html;

actualmente este es el codigo de los botones, pero no logro dar con la solucion para poder multiplar el valor de la const precio, con la cantidad actual de productos.

const precio = 400000

document.querySelector(".precio-inicial").innerHTML = precio


function sumar(){
    let plus = document.querySelector(".cantidad");
    let amountplus = parseInt(plus.innerHTML);
    plus.innerHTML = amountplus +1
}

function restar(){
    let minus = document.querySelector(".cantidad");
    let amountminus = parseInt(minus.innerHTML);
    minus.innerHTML = amountminus -1
}

Este es mi intento para crear la multiplicacion del total por el valor;

let total = document.querySelector(".valor-total");
let totalamount = parseInt(document.querySelector(".cantidad").innerHTML);
let value = parseInt(precio);
total.innerHTML = totalamount * value;

Muchas gracias de antemano por darse el tiempo de leer mi solicitud. Que tengas buen dia

1
  • coloca el HTML a la pregunta
    – Yussef
    Commented el 29 oct. 2023 a las 15:12

1 respuesta 1

0

¡Hola!

Si he entendido bien, prueba esto a ver si te funciona.

Para calcular el valor total y mostrarlo en el otro párrafo que has preparado para eso, necesitas actualizar el cálculo. Puedes crear una función que se llama cuando se realiza un cambio en la cantidad de productos, ya sea sumando o restando un producto. Aquí hay una forma de hacerlo:

<!-- Primero, asegúrate de que el HTML tenga un elemento para mostrar el valor total, span, div o cualquiera -->
   <p>Valor total: <span class="valor-total">0</span></p> 

<!-- Después, crea una función para actualizar el total y modifica las funciones sumar y restar para calcular el valor total y actualizarlo cuando se haga clic-->
   <script>
      const precio = 400000;

      document.querySelector(".precio-inicial").innerHTML = precio;
      let cantidad = document.querySelector(".cantidad");
      let total = document.querySelector(".valor-total");

      function actualizarTotal() {
         let amount = parseInt(cantidad.innerHTML);
         let value = parseInt(precio);
         total.innerHTML = amount * value;
      }

      function sumar() {
         let amountplus = parseInt(cantidad.innerHTML);
         cantidad.innerHTML = amountplus + 1;
         actualizarTotal();
      }

      function restar() {
         let amountminus = parseInt(cantidad.innerHTML);
         if (amountminus > 0) {
            cantidad.innerHTML = amountminus - 1;
            actualizarTotal();
         }
      }
   </script>

La función actualizarTotal se encarga de calcular el valor total multiplicando la cantidad de productos por el precio de la constante, y luego actualiza el contenido del elemento HTML que tiene clase valor-total.

Las funciones sumar y restar llaman a actualizarTotal después de cambiar la cantidad de productos para actualizar el valor total cada vez que se haga clic en los botones de suma o resta.

Espero haberte ayudado, ¡un saludo!

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.