How To Disable Enable Button After One Click In Javascript

If you want to disable/enable a button after clicking the button in JavaScript, you can use the button element’s disabled attribute. When you set the button’s disabled attribute’s value to true, then the button will be disabled. When you set the button’s disabled attribute’s value to false, then the button will be enabled. This article will give you some examples.

1. How To Disable Enable Button After One Click In Javascript Example.

  1. There are 2 buttons on this example web page.
  2. When you click the second button, it will change the first button’s disabled attribute value to disable or enable it.
  3. And it will also change the second button’s text accordingly.
  4. The example Html file name is how-to-enbale-disable-button-in-javascript.html.
  5. Below is the above Html file source code.
    <!DOCTYPE html>
    <html>
    <head>
        <title>How To Enable Disable Button In JavaScript</title>
    
        <meta charset="utf-8">
    
        <script type="text/javascript">
    
            function toggleButton(buttonId, tirggerBtnId){
    
                var btn = document.getElementById(buttonId);
    
                var trigerBtn = document.getElementById(tirggerBtnId);
    
                if(btn.disabled){
    
                    btn.disabled = false;
    
                    trigerBtn.value = "Disable Button1";
    
                }else{
    
                    btn.disabled = true;
    
                    trigerBtn.value = "Enable Button1";
    
                }
            }
    
        </script>
    
    </head>
    <body>
    
        <input type="button" value="Button1" id="btn1" />
    
        <input type="button" value="Disable Button1" onclick="toggleButton('btn1', 'tirggerBtn')" id="tirggerBtn" />
    
    </body>
    </html>

Subscribe to receive more programming tricks.

We don’t spam!

close

Subscribe to receive more programming tricks.

We don’t spam!

0 0 votes
Article Rating
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x