HTML | DOM Select autofocus Property
The Select autofocus property in HTML DOM is used to set or return whether a drop-down list should automatically get focused when the page loads, or not.
The property returns true if the drop-down list automatically gets focus otherwise, it returns false.
The Select autofocus property reflects the HTML autofocus attribute.
Syntax for returning the autofocus property
selectObject.autofocus
Syntax for setting the autofocus property
selectObject.autofocus = true|false
Property Values
- true :The drop-down list get autofocus.
- false : It has a default value. The drop-down list does not get focus.
Return Value: It returns a Boolean value which represents that the dropdown list get focus or not.
Below program illustrates the Select autofocus property :
Example-1: Finding out if a drop-down list automatically gets focus upon page load.
html
<!DOCTYPE html><html><head> <title> Select Autofocus Property in HTML </title> <style> h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </style></head><body> <h1> GeeksforGeeks </h1> <h2> Select Autofocus Property </h2> <br> Select your preferred course from the drop-down list: <select id="Courses" autofocus> <option value="C++">c++</option> <option value="Placement">Placement</option> <option value="Java">Java</option> <option value="Python">Python</option> </select> <p> To find out if the drop-down list automatically gets focused upon page load or not, double-click the "Check" button. </p> <button onclick="My_list()">Check</button> <p id="test"></p> <script> function My_list() { var d = document.getElementById("Courses").autofocus; document.getElementById("test").innerHTML = d; } </script></body></html> |
Output:
Before clicking the button:
After clicking the button:
Supported Browsers: The browser supported by DOM Select autofocus Property are listed below:
- Google Chrome
- Internet Explorer 10.0 +
- Firefox
- Opera
- Safari
Please Login to comment...