Input file Upload, JS control the size and format of uploaded files

File upload is usually uploadify with jquery, and it's more useful. There will be an article about uploadify this plugin later.

However, sometimes in order to lazy, directly with input file for files and images, such as uploading, input file can control the format of the upload, but is HTML5, many browsers do not support, please see my article on the input file upload type control.

Below I use JavaScript to control the file upload size and type.

Post the HTML code:

<form  Action="Back-end Interface" Enctype="Multipart/form-data" Method="POST" Id="Attachment_uploads"> <div Class="Attachs FL"> <div Class="T_fjfont">Attachment:</div> <div Class="Upload_btns"><input Type="File" Name="File" Id="File" OnChange="Filechange(This);" /> </div> </div> <div Class="Attachs FL"> <div Class="T_fjfont" Style="Color:Red;Font-Size:12px;Font-Weight:Bold">File Limit 2mb</d</div> <div Class="Attachs FL"> <div Class="Upload_btns"><input Type="File" Name="Files" Id= "File_fujian"  onchange = "filefujianchange ( This " /> <input type= "hidden" name= "rev"  class= "Hide_rev"  /></div>  </div> </FORM>   

JavaScript code:

var isie = /msie/i. Test(navigator. useragent) && ! Window. Opera;

functionFilechange(Target) { VarFileSize= 0; If (Isie&& !Target.Files) { VarFilePath=Target.Value; VarFileSystem= New ActiveXObject("Scripting.FileSystemObject"); VarFile=FileSystem.GetFile (FilePath);FileSize=File.Size; } Else {FileSize=Target.Files[0].Size; } VarSize=FileSize/ 1024; If(Size>2000){Alert("Attachment cannot be greater than 2M");Target.Value=""; Return } VarName=Target.Value; VarFileName=Name.Substring(Name.LastIndexOf(".")+1).toLowerCase(); If(FileName!="XLS" &&FileName!="Xlsx"){Alert("Please choose execl format file Upload!" ");Target.Value=""; Return } } functionFilefujianchange(Target) { VarFileSize= 0; If (Isie&& !Target.Files) { VarFilePath=Target.Value; VarFileSystem= New ActiveXObject("Scripting.FileSystemObject"); VarFile=FileSystem.GetFile (FilePath);FileSize=File.Size; } Else {FileSize=Target.Files[0].Size; } VarSize=FileSize/ 1024; If(Size>2000){Alert("Attachment cannot be greater than 2M");Target.Value=""; Return } VarName=Target.Value; VarFileName=Name.Substring(Name.LastIndexOf(".")+1).toLowerCase(); If(FileName!="JPG" &&FileName!="JPEG" &&FileName!="PDF" && FileName != "PNG"  && FileName !=  "DWG"  && FileName != "gif"  ) { Alert ( "Please select the image format File upload (jpg,png,gif,dwg,pdf,gif, etc.)!" " Target.= ";return } }    

The above code at that time in order to consider compatibility issues, did not write HTML5 file upload control, directly in the JS control. This code supports all major browsers! Compatibility is still possible! Welcome to the Exchange!

Original link

Input file Upload, JS control the size and format of uploaded files