How can I print users input name as he enters in the input box-CodePudding

function.getElementById("a")
{
    var input= document.getElementById("a")
    console.log("input")
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script src="index.js">
    </script>
  <div >
    <input id="a" placeholder="enter here..." >
    </div>
</body>
</html>

I want to print the name of user as same he enters in the input box.

CodePudding user response：

You can try something like this. You need to add an event listener to a variable which represents the input element. The event it listens for is the input event. When any input happens the function fires which logs the value of the input element to the console.

const input= document.querySelector("#a")

input.addEventListener('input', function(event){
  console.log(event.target.value);
});

<input id="a" placeholder="enter here..." >

CodePudding user response：

use event keyup

addEventListener('keyup',test)

function test(){

let x = document.getElementById('a').value
console.log(x)



}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script src="index.js">
    </script>
  <div >
    <input id="a" placeholder="enter here..." >
    </div>
</body>
</html>