HTML | DOM Input Color disabled Property
The DOM Input Color disabled Property in HTML DOM is used to set or return whether a color picker should be disabled or not. A Disabled element is usually is unusable and un-clickable and are usually grey in color by default in all the Browser. This Property is used to reflect the HTML disabled attribute.
Syntax:
- It is used to return the disabled property.
colorObject.disabled
- It is used to set the disabled property.
colorObject.disabled = true|false
Property Values:
- true: It specify that the color picker is disabled.
- false: It has a Default value. It defines that the color picker would not be disabled.
Return Value: It returns a Boolean value which represents that the color picker would be disabled or not.
Example-1: This Example illustrates how to return the Property.
html
<!DOCTYPE html><html><head> <title> HTML DOM Input Color disabled Property </title></head><body style="text-align:center;"> <h1> GeeksForGeeks </h1> <h2> HTML DOM Input Color disabled Property </h2> <form id="myGeeks"> <label> Select your favorite color: </label> <input type="color" value="#009900" name="Geek_color" id="color" disabled> </form> <button onclick="myGeeks()"> Click Here! </button> <p id="GFG" style="color:green; font-size:24px;"> </p> <script> function myGeeks() { var x = document.getElementById( "color").disabled; document.getElementById( "GFG").innerHTML = x; } </script></body></html> |
Output:
Before Clicking On Button:
After Clicking On Button:
Example-2: This Example illustrates how to set the Property.
html
<!DOCTYPE html><html><head> <title> HTML DOM Input Color disabled Property </title></head><body style="text-align:center;"> <h1> GeeksForGeeks </h1> <h2> HTML DOM Input Color disabled Property </h2> <form id="myGeeks"> <label> Select your favorite color: </label> <input type="color" value="#009900" name="Geek_color" id="color" disabled> </form> <button onclick="myGeeks()"> Click Here! </button> <p id="GFG" style="color:green; font-size:24px;"> </p> <script> function myGeeks() { var x = document.getElementById( "color").disabled = false; document.getElementById("GFG").innerHTML = x; } </script></body></html> |
Output:
Before Clicking On Button:
After Clicking On Button:
Supported Browsers: The browsers supported by DOM input color disabled property are listed below:
- Google Chrome 20
- Edge 14
- Firefox 29
- Opera 12
- Safari 12.1
Please Login to comment...