DEV Community

Arul .A
Arul .A

Posted on

Create a webpage using JavaScript and the DOM where a button becomes disabled after the user clicks it

#webdev

Today we are discuss about the above topic. When the user give the input and showing the button to click, and initially when the user not given output the button has disabled.

First we are creating the h1 element for just storing the title(display button after click),and we use the input to get the input from the user and finally we use the button tag and it is used to clickable action.

program:

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

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

<body>
    <h1>display button after click</h1>
    <input oninput="click1()" id="input" type="text">
    <button id="btn" disabled>show</button>

    <script>
        function click1() {
            const input = document.getElementById("input")
            const display = document.getElementById("btn")
            if (input.value.length > 0) {
                display.disabled = false
            }
            else {
                display.disabled = true
            }
        }
</script>

</body>

</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (0)