Primero creé un elemento de entrada que tomará la entrada de texto del usuario ...... <input style=" font-size: 12 px;" type="text" name="text" id="txt">
Luego, para esto, utilicé algo de javascript para obtener el valor del texto que el usuario da como entrada para lo cual escribo el siguiente código.... const text= document.querySelector('#txt').value console.log(text)
Pero con esto no obtengo ningún tipo de valor, en realidad solo obtengo un valor nulo vacío en la consola, ¿alguien puede señalar el error en el código?
Le sugiero que envuelva su entrada en un formulario. Luego, cuando se haya enviado el formulario, podrá imprimir el contenido del texto de entrada. Por favor, revisa este ejemplo que hice en codepen:
const onSubmit = (e) => { e.preventDefault(); const text = document.querySelector("#txt").value; console.log(text); }; const form = document.querySelector("form"); form.addEventListener("submit", onSubmit);Además, puede obtener el valor del texto de entrada cuando cambia a través del evento "cambiar" si no desea utilizar un formulario. Por ejemplo:
const onChange = (e) => { const text = e.target.value; console.log(text); }; const input = document.querySelector("#txt"); input.addEventListener("change", onChange);Si este ejemplo no satisface lo que quiere lograr, hágamelo saber ;).
Para leer la entrada que ha escrito un usuario, debe agregar un detector de eventos al elemento jnput o a un botón de envío asociado.
Este fragmento da un ejemplo simple. Ejecuta su Javascript cuando el usuario presiona enter:
const input = document.querySelector('#txt'); input.addEventListener('change', function() { console.log(input.value); }); <input style=" font-size: 12 px;" type="text" name="text" id="txt">¿Intentó algo simple usando eventos html onkeyup/onchange?
var handlerFunction = function() { const text = document.getElementById("txt").value; console.log(text); } <input style=" font-size: 12 px;" type="text" name="text" id="txt" onkeyup="handlerFunction()">