HTML DOM Input Color Autofocus Property



The HTML DOM Input Color autofocus property sets/returns whether Input Color is focused upon initial page load.

Syntax

Following is the syntax −

  • Returning boolean value - true/false
inputColorObject.autofocus
  • Setting autofocus to booleanValue
inputColorObject.autofocus = booleanValue

Boolean Value

Here, “booleanValue” can be the following −

booleanValue Details
true It defines that input will be autofocused on page load.
false It is the default value and input is not autofocused.

Example

Let us see an example of Input Color autofocus property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Input Color Autofocus</title>
</head>
<body>
Color Picker: <input type="color" id="Color" autofocus>
<button onclick="removeAutoFocus()">Remove Auto Focus</button>
<div id="divDisplay"></div>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputColor = document.getElementById("Color");
   divDisplay.textContent = 'Autofocus: '+inputColor.autofocus function removeAutoFocus() {
      if(inputColor.autofocus == true){
         inputColor.autofocus = false;
         divDisplay.textContent = 'Autofocus: '+inputColor.autofocus
      }
   }
</script>
</body>
</html>

Output

This will produce the following output −

Before clicking ’Remove Auto Focus’ button −

After clicking ‘Remove Auto Focus’ button −

Updated on: 2019-07-30T22:30:26+05:30

101 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements