HTML <button> disabled Attribute
The HTML <button> disabled attribute prevents user interaction with the button, making it unclickable and visually indicating its disabled state. It’s typically used to indicate that a button is inactive or unavailable for interaction.
Syntax:
<button disabled></button>
HTML Button Disabled Attribute Example
Example: This example display implementation of button disabled attribute.
HTML
<!DOCTYPE html><html><head> <title>HTML button disabled Attribute</title></head><body style="text-align:center"> <h1 style="color: green;">GeeksforGeeks</h1> <h2>HTML button disabled Attribute</h2> <!-- A disabled button --> <button type="button" disabled>I am disabled!</button></body></html> |
Output:
Explanation:
- In this example we features a disabled button element created using the <button> tag with the text “I am disabled!”.
- The button is disabled using the disabled attribute, preventing user interaction.
- The styling ensures the content is centered on the page using inline CSS for text alignment and color.
HTML button disabled Attribute Use Cases
1. How to specify that a button should be disabled using HTML5?
To specify a button as disabled in HTML5, add the disabled attribute to the <button> tag, like this: <button type=”button” disabled>.
2. How to disable button element dynamically using JavaScript ?
To disable a button dynamically using JavaScript, target the button element and set its disabled property to true, like this: buttonElement.disabled = true;.
3. Which attribute is used to disabled the specific input field in HTML Form ?
The disabled attribute is used to disable a specific input field in an HTML form. It’s applied directly to the input element, like this: <input type=”text” disabled>.
4. How to enable/disable a button using jQuery ?
To enable/disable a button using jQuery, select the button element and use the prop() method to set its disabled property to true or false, like this: `$(‘#myButton’).prop(‘disabled’, true/false);.
5. How to remove “disabled” attribute from HTML input element using JavaScript ?
To remove the “disabled” attribute from an HTML input element using JavaScript, target the element and use the removeAttribute() method, like this: inputElement.removeAttribute(‘disabled’);.
Supported Browsers
The browser supported by <button> disabled attribute are listed below:
