SimpleTuts.com

User inputs in JavaScript

JavaScript utilizes <form> elements to manage user input via <input>, <select>, and <textarea> tags. Interaction is facilitated through event listeners, enabling dynamic handling of form submissions and data retrieval for robust web application functionality.


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>User input in JavaScript</title>
</head>

<body>
    <form action="">
        <label for="">Enter your name</label>
        <input type="text" id="name">
        <br><br>
        <label for="">Enter your place</label>
        <input type="text" id="place">
        <br><br>
        <label for="">Enter your age</label>
        <input type="number" id="age">
        <br><br>
        <button type="button" onclick="userInfo();">Submit</button>
    </form>
    <script>
        function userInfo(){
            var name = document.getElementById('name').value;
            var place, age;
            place = document.getElementById('place').value;
            age = document.getElementById('age').value;
            document.write("<h3>Hello I am " + name + " from " + place + ", I am " + age + " years old</h3>");
        }
    </script>
</body>
</html>    
Run Code