HTML5 new feature type=file file upload function

Author：Eve Cole Update Time：2025-02-14 14:00:03

1. Grammar

<input name=myFile type=file>

2. Attributes (the following three are only supported by HTML5, so there are compatibility issues)

(1) multiple: Indicates whether the user can select multiple values. Multiple can only be used with type=file and type=email.

(2) accept: The file type accepted by the server, otherwise it will be ignored.

audio/* represents sound files. Only supported by HTML5

video/* represents video files. Only supported by HTML5

image/* represents image files. Only supported by HTML5

(3) required: This attribute specifies that the user must fill in a value before submitting the form.

3. Get uploaded file information

 <!DOCTYPE html><html lang=zh> <head> <meta charset=UTF-8 /> <meta http-equiv=X-UA-Compatible content=ie=edge /> <title>file multiple</title> </head> <body> <input type=file multiple=multiple id=test> <p id='content'></p> <script type=text/javascript> var test = document.getElementById('test'); test.addEventListener('change', function() { var t_files = this.files; var str = ''; for(var i = 0, len = t_files.length; i < len ; i++) { console.log(t_files[i]); str += '<a href=javascript:void(0)>' + t_files[i].name + '</a><br/>'; }; document.getElementById('content').innerHTML = str; }, false); </script> </body></html>

show:

For more specific usage, see MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file

Summarize

The above is the new HTML5 feature type=file file upload function introduced by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank everyone for your support of the VeVb martial arts website!