Estoy tratando de obtener el valor de una entrada en tiempo real pero no puedo obtenerlo
Estoy intentando que en el botón inferior, la primera X sea la cantidad de zanahorias especificada en la entrada anterior, y en la segunda X sea un número que se calculará en un script , todo en tiempo real (si el número de entrada cambia, los de abajo cambiarán automáticamente) pero para eso necesito una forma de obtener el valor de la entrada en tiempo real
Aquí está el código, estoy usando express-handlebars y Bootstrap para los estilos y clases
<div class="col-md-auto mx-auto"> <h3 class="text-center">Buy</h3> <form action="/dashboard/" method="POST"> <div class="form-group"> <input type="number" id="buyA" min="3"class="form-control" name="buyA" placeholder="Amount"> <div class="d-grid gap-2"> <button class="btn btn-success">Buy X Things X</button> </div> </div> <input type="hidden" id="buy" name="buy" value="buy"> </form> </div>Uno de los scripts que he probado es este, pero no muestra nada y simplemente lo puse en lugar de la X (soy un poco novato en HTML), es decir, en lugar de la XI solo ponga ese Script para obtener su valor con suerte
<script> let buyAmount = document.getElementById('buyFormAmount').value; if (!buyAmount || <= 0) = "?"; return buyAmount; </script>Debe crear una función que se llamará cuando cambie la entrada de id buyForm . En esa función, debe obtener el valor de entrada, calcular 'la segunda X ' y configurar el html interno para los span HTML que deben estar en su botón de clase btn btn-success .
Debe agregar un Event Listener en el campo de entrada, vea el ejemplo a continuación.
var x = document.getElementById('txt'); x.addEventListener('input', function(){ document.getElementById("myBtn").innerHTML="Buy "+x.value+" Rabbits by "+ x.value+" Carrots" }); <input type="text" id="txt" name="txt" value="" > <button id="myBtn" value="myvalue" >Try it</button>