Javascript Reference - HTML DOM Input FileUpload accept Property

The accept attribute from input file upload specifies the types of files that the server accepts.

The accept property sets or gets the accept attribute of the file upload button.

Browser Support


`accept`	Yes	10.0	Yes	Yes	Yes

Syntax

Return the accept property.

var v = fileuploadObject.accept

Set the accept property.

fileuploadObject.accept='audio/*,video/*,image/*,MIME_type'

Property Values

Tip: To specify more than one value, separate the values with a comma.

Value	Description
audio/*	All sound files are accepted
video/*	All video files are accepted
image/*	All image files are accepted
MIME_type	A valid MIME type

Return Value

A String type value containing a comma-separated list of accepted content types.

Example

The following code shows how to get the accepted content type of a <input type="file"> element.


<!DOCTYPE html>
<html>
<body>
<!--   w  w w  .j a  v  a  2  s .  c o m-->
Select a file to upload:
<input type="file" id="myFile" size="50" accept="image/*">
<button onclick="myFunction()">test</button>

<p id="demo"></p>

<script>
function myFunction() {
    var x = document.getElementById("myFile").accept;
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

The code above is rendered as follows:

Example 2

The following code shows how to accept multiple content types.


<!DOCTYPE html>
<html>
<body>
<!--from w w w. j a va 2s.c  o m-->
Select a file to upload:
<input type="file" id="myFile" size="50">
<button onclick="myFunction()">test</button>

<p id="demo"></p>

<script>
function myFunction() {
    document.getElementById("myFile").accept = "audio/*,video/*";
    document.getElementById("demo").innerHTML = "changed";
}
</script>
</body>
</html>

The code above is rendered as follows:

Example 3

The following code shows how to change the accepted content type.


<!DOCTYPE html>
<html>
<body>
<!--   w  ww .  j  a  va  2s  .c  o m-->
Select a file to upload:
<input type="file" id="myFile" size="50" accept="image/*">
<button onclick="myFunction()">test</button>
<script>
function myFunction() {
    document.getElementById("myFile").accept = "audio/*";
}
</script>
</body>
</html>

The code above is rendered as follows: