Disable and Enable a Button in Javascript

Here we are going to disable a button with Javascript. Disable a button means that the button exists on the HTML page but does not perform any task.

There are many methods to disable a button, So let start and learn some best methods.

Method 1 : Toggle Disabled and Enable a Button

In this method, we disable and enable a button by one button

HTML

 <button onclick="dis()">Toggle Disable/Enable </button>
    <hr>
 <button id="Button" type="button">I am Button</button>

Javascript

<script>
        function dis() {
        Button.disabled= !Button.disabled;
        }
</script>

Method 2 : Disabled and Enable a Button by two function

In this method, we make two buttons, one for Disabled and another for enabling a button. The Document method getElementById() returns an Element an object representing the element whose id property matches the specified string.

HTML

 <button onclick="btnDisabled()">Click me to Disable button</button>
 <button onclick="myEnable()">Click me to Enable a button</button>

    <hr>
    <button id="Button" >I am Button</button>

Javascript

<script>
        function btnDisabled() {
           
            document.getElementById("Button").disabled = true;
        }
        function myEnable() {
           
            document.getElementById("Button").disabled = false;
        }
</script>

Here we completed the post on Disable and Enable a Button in Javascript.

Hope it helps you.