Lo que estoy tratando de hacer es mostrar el texto inmediatamente, lo escribo en un cuadro de entrada, hasta ahora mi función javascript ni siquiera funciona, solo necesito que la función muestre cuándo se escribe o borra un texto en el cajas de texto.
<!DOCTYPE html> <html> <head> <link href="styles.css" rel="stylesheet"> </head> <body> <div class="output-box"> <P class="Output-text"></P> <P class="Output-text2"></P> </div> <div class="forms"> <form action="POST"> <label class="label" for="name">First Name:</label> <input type="text" id="name" name="name" onchange="GetAndDisplayInput()"> <br> <br> <label class="label" for="name">Last Name:</label> <input type="text" id=" last-name" name="name" onchange="GetAndDisplayInput()"> </form> </div> <script> function GetAndDisplayInput(){ var inputFirstName= document.getElementById("name").value; var inputLastName= document.getElementById("last-name").value; document.getElementsByClassName("Output-text").innerHTML = inputFirstName; document.getElementsByClassName("Output-text2").innerHTML = outputFirstName; } </script> </body> </html>Intente usar el detector de eventos oninput en lugar de onchange :
https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/oninput
Esto se activará inmediatamente después de cada cambio, a diferencia de cada vez que el elemento esté borroso (desenfocado/seleccionado).
Ejemplo
function display() { document.querySelector("p").innerText = document.querySelector("input").value; } <input oninput="display();" placeholder="Type in some text"> <p></p>