javascrip client verifies file size and file type and resets upload_form effects

The following is a general javascript script I wrote. Although there are many parameters that need to be assigned when calling, they are all really needed in actual needs. You can refer to it and change it to the script you need.

Copy code The code is as follows:

/*****Get file information edit by zhaogw reference by misssionOtherAttEdit.jsp*****/
/*file: input type="file" object, generally use this.
vType: An object name used to record the file type information of the file. Generally it is an input object.
DivType: The name of a Div object. Use its innerHTML content to display file type information.
vFile: An object name used to record the file name information of the file. Generally it is an input object.
DivFile: The name of a Div object. Use its innerHTML content to display the file name information of the file.
vSize, DivSize are similar to the above, but only record the size information of the file.
mMaxSize: Calculate the maximum file size allowed to be uploaded in m.
allowType: only accepted file types
*/
function getFileInfo(file,mMaxSize,allowType,vFile,DivFile,vType,DivType,vSize,DivSize){
var filePath = file.value; //File path
var fileName;//File name
var fileType;//File type
var tmpObj;//Temporary object
var notAllowType=new Array("exe","bat" ,"asp","jsp","js","dll");
var mHTML=document.getElementById(file.name 'Td').innerHTML;
/*
var mHTML=" ";
*/
// alert(mHTML);
//get file name
if(filePath != null && filePath != ''){
var pass=true;
//File type
fileType = filePath.substring(filePath.lastIndexOf('.') 1, filePath.length);
if (fileType!=null&&fileType!='')
{
for (var i in notAllowType){
if (fileType.toLowerCase()==notAllowType[i] ){
pass=false;
break;}
}
}
//The allowed type, if empty, the allowed type will not be set
var match=false;
if (allowType!=null&&allowType!=''){
var allowList=allowType.split('|');
for (var j in allowList){
if (fileType.toLowerCase()== allowList[j].toLowerCase()){
match=true;
break;}
}
} else {match=true;}
if (pass&&match)
{
fileName = filePath.substring(filePath.lastIndexOf('\') 1,filePath.length);
tmpObj=document.getElementById(vType);
if (tmpObj!=null)
tmpObj. value = fileType;
tmpObj=document.getElementById(DivType);
if (tmpObj!=null)
tmpObj.innerHTML = fileType;
tmpObj=document.getElementById(vFile);
if (tmpObj!=null)
tmpObj.value = fileName;
tmpObj=document.getElementById(DivFile);
if (tmpObj!=null)
tmpObj.innerHTML = fileName;
try{
var fso,f,s;
fso = new ActiveXObject("Scripting.FileSystemObject");
f = fso.GetFile(file.value);
if(f.Size > ; mMaxSize*1048576){
alert("File size cannot exceed" mMaxSize "M");
document.getElementById(file.name 'Td').innerHTML = mHTML;
tmpObj=document.getElementById (vType);
if (tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivType);
if (tmpObj!=null)
tmpObj .innerHTML = '';
tmpObj=document.getElementById(vFile);
if (tmpObj!=null)
tmpObj.value = '';
tmpObj=document.getElementById(DivFile);
if (tmpObj!=null)
tmpObj.innerHTML = '';
tmpObj=document.getElementById(vSize);
if (tmpObj!=null)
tmpObj.value = ' ';
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML = '';
return;
}
else
{
tmpObj=document.getElementById(vSize);
if (tmpObj!=null)
tmpObj.value = f.Size;
tmpObj=document.getElementById(DivSize);
if (tmpObj!=null)
tmpObj.innerHTML = f.Size " byte (byte)";
var imgType=new Array("jpg","jpeg","gif","bmp");
var isImg=false;
//File type
if (fileType!=null&&fileType!='')
{
for (var k in imgType){
if (fileType .toLowerCase()==imgType[k]){
isImg=true;
break;}
}
}
var tmpObj=document.getElementById("imgView");
if (isImg&&tmpObj){
var y = document.getElementById(file.name "img");
if(y){
y.src = "file://localhost/" file.value ;
}else{
var img=document.createElement("img");
img.setAttribute("src","file://localhost/" file.value);
img .setAttribute("width","120");
img.setAttribute("height","90");
img.setAttribute("id",file.name "img");
tmpObj.appendChild(img);
}
}}
}catch(e){
//ignore
}
}
else if (!pass) {alert ("The file type is not allowed to be uploaded: " fileType);document.getElementById(file.name 'Td').innerHTML = mHTML;}
else if (!match) {alert("Only the file type is allowed to be uploaded:" " allowType);document.getElementById(file.name 'Td').innerHTML = mHTML;}
}
}

Code for calling method:

Copy code The code is as follows:

Need to display the currently uploaded image Add the following code:

Briefly explain the relevant conventions of the script:

1: Use if necessary Object (or other object with innerHTML attribute to contain the input type="file" object, and the name must be the input's name attribute "Td" as the suffix)
2: imgView is hardcoded , because I don’t want to add more parameters, so I’ll fix this here. You can also pass the name as a parameter. It’s up to your convenience.
3: All parameters can be '' but the first parameter is basically this. The script will automatically determine the relevant parameters.