Skip to content
Related Articles

Related Articles

Improve Article
HTML | DOM Input FileUpload autofocus Property
  • Difficulty Level : Basic
  • Last Updated : 19 Mar, 2019

The Input FileUpload autofocus property in HTML DOM is used to set or return whether a file upload button should automatically get focus when the page loads, or not.

Syntax:

  • Return the autofocus property:
    fileuploadObject.autofocus
  • Set the autofocus property:
    fileuploadObject.autofocus=true|false

Property Values:

  • true : The file upload button get focused
  • false : The file upload button does not get focused

Return Value:

  • It returns the boolean value which represents that upload button focused or when.

Example-1: Return autofocus property.






<!DOCTYPE html>
<html>
  
<head>
    <style>
        h1 {
            color: green;
        }
    </style>
</head>
  
<body>
    <center>
        <h1>Geeks for Geeks</h1>
        <input type="file"
               id="myFile"
               autofocus>
  
        <p id="demo">
      </p>
  
        <button onclick="myFunction()">
          Click
      </button>
  
        <script>
            function myFunction() {
                var x = 
                    document.getElementById(
                      "myFile").autofocus;
                
                document.getElementById(
                  "demo").innerHTML = x;
            }
        </script>
    </center>
</body>
  
</html>

Output:
Before Click:

After Click:

Example-2: Set autofocus property.




<!DOCTYPE html>
<html>
  
<head>
    <style>
        h1 {
            color: green;
        }
    </style>
</head>
  
<body>
    <center>
        <h1>
          Geeks for Geeks
      </h1>
        <input type="file"
               id="myFile">
  
        <p id="demo">
      </p>
  
        <button onclick="myFunction()">
          Click
      </button>
  
        <script>
            function myFunction() {
                var x = 
                    document.getElementById(
                      "myFile").autofocus = 
                    "true";
                
                document.getElementById(
                  "demo").innerHTML = x;
            }
        </script>
  </center>
  
</body>
  
</html>

Output:
Before Click:

After Click:

Supported Browsers:

  • Google Chrome
  • Mozilla Firefox
  • Edge
  • Opera
  • Safari



My Personal Notes arrow_drop_up
Recommended Articles
Page :