Tengo un pequeño problema con mis botones para un proyecto escolar. Cuando actualizo la cantidad escribiéndola en el formulario, el precio se actualiza, pero cuando trato de cambiar la cantidad haciendo clic en mis botones, no funciona.
function increaseValue() { value = parseInt(document.getElementById("qty").value, 10); value = isNaN(value) ? 0 : value; value++; document.getElementById("qty").value = value; } function decreaseValue() { value = parseInt(document.getElementById("qty").value, 10); value = isNaN(value) ? 0 : value; value < 1 ? value = 1 : ''; value--; document.getElementById('qty').value = value; } let basePrice = document.getElementById("price").innerHTML; document.querySelector("#qty").addEventListener("change", function() { document.querySelector("#changingprice span").innerText = (basePrice * this.value).toFixed(2) }) <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> <span id="price">6.99</span> <div class="num-block skin-5"> <div class="num-block skin-2 pt-2"> <div class="num-in"> <span class="minus dis" id="decrease" onclick="decreaseValue()"></span> <input type="number" id="qty" min="0" value="0" /> <span class="plus" id="increase" onclick="increaseValue()"></span> </div> </div> </div> <button id="changingprice" class="rounded buttonshad buttonstyling bg-primary text-light mx-5">Add $<span>0.00</span></button>