The task is to remove the disabled attribute from the input element using JavaScript. This can be achieved by the following two approaches.
- Selecting elements’s id and setting the disabled property to false
- Selecting elements’s class and setting the disabled property to false
Approach 1: Select the input element and use disabled property and set its value to false.
Example : This example implements the above approach
html
<!DOCTYPE html><html><head> <title> How to remove “disabled” attribute from HTML input element using JavaScript ? </title> <style> body { text-align: center; } h1 { color: green; } </style></head><body> <h1 style="color:green;"> neveropen </h1> <p> Click on the button to remove disabled attribute </p> Type: <input id="input" disabled /> <br> <br> <button onclick="myGFG()"> Click Here </button> <p id="gfg"> </p> <script> var down = document.getElementById("gfg"); function myGFG() { document.getElementById('input').disabled = false; down.innerHTML = "Disabled Attribute removed"; } </script></body></html> |
Output:
Approach 2: Select the input element and use disabled property and set its value to false. This example selects input element by its class.
Example: This example implements the above approach
html
<!DOCTYPE HTML><html><head> <title> How to remove “disabled” attribute from HTML input element using JavaScript ? </title> <style> body { text-align: center; } h1 { color: green; } </style></head><body> <h1 style="color:green;"> neveropen </h1> <p> Click on the button to remove disabled attribute </p> Type: <input id="input" disabled /> <br> <br> <button onclick="myGFG()"> Click Here </button> <p id="gfg"> </p> <script> var down = document.getElementById("gfg"); function myGFG() { var input = document.getElementsByClassName('inputClass'); for (var i = 0; i < input.length; i++) { input[i].disabled = false; } down.innerHTML = "Disabled Attribute removed"; } </script></body></html> |
Output:
