Estoy trabajando con formularios html y agregando funcionalidad a los botones usando JS. He creado una para capturar el nombre del usuario una vez introducido este en el campo de texto. El problema es que cuando trato de mostrar la entrada del usuario en la consola, esta aparece por un instante muy corto y luego desaparece. `
El siguiente es mi código HTML:
<form action=""> <div> <label for="myName">Name</label> </div> <div> <input type="text" name="myName" id="myName" class="name"> </div> <button class="thisOne">Collect Info</button> </form>`El siguiente es mi JS
` let input_name = document.querySelector('.name'); let btn = document.querySelector('button'); btn.addEventListener('click', ()=>{ console.log(input_name.value); });`Utilice event y preventDefault para evitar el envío del formulario.
const input_name = document.querySelector('.name'); const btn = document.querySelector('.thisOne'); btn.addEventListener('click', (e)=>{ e.preventDefault(); console.log(input_name.value); }); <form action=""> <div> <label for="myName">Name</label> </div> <div> <input type="text" name="myName" id="myName" class="name"> </div> <button class="thisOne">Collect Info</button> </form>