Restrictions before JS uploads images include (jpg jpg gif and size, height and width), etc. _javascript skills

Function:
1. Limit extension: only jpg || jpg and gif
2. Limit image size: K in units
3. Limit image width and height: px in unit (either both or neither)
4. Restrict damaged pictures (pictures without preview)
5. Restrict pictures with changed extensions (such as forcing a dynamic GIF extension to JPG )
Usage restrictions:
Add onchange event in InputFile so that it can load it in an img tag after selecting the file, otherwise the use will be wrong
imglimit.js

Copy code The code is as follows:

function limitImg(){
var img=document. getElementById(arguments[0]);//The object displaying the image
var maxSize=arguments[1];//
var allowGIF=arguments[2]||false;
var maxWidth=arguments[3 ]||0;
var maxHeight=arguments[4]||0;
var postfix=getPostfix(img.src);
var str=".jpg";
if(allowGIF) {str =".gif"}
if(str.indexOf(postfix.toLowerCase())==-1){
if(allowGIF){return "The image format is wrong, only jpg or gif images can be uploaded ";}else{return "The image format is incorrect, only jpg images can be uploaded";}
}else if(img.fileSize>maxSize*1024){
return "The image size exceeds the limit, please limit it to" maxSize "Within K";
}else{
if(img.fileSize==-1){
return "The picture format is wrong. It may be damaged or the extension has been changed. Please choose another picture. ";
}else{
if(maxWidth>0){
if(img.width>maxWidth){
return "The image width exceeds the limit, please keep it within " maxWidth " pixels";
}else{
if(img.height>maxHeight){
return "The image height exceeds the limit, please keep it within " maxHeight "pixels";
}else{
return "" ;
}
}
}else{
return "";
}
}
}
}
//Get the file extension based on the path
function getPostfix(path){
return path.substring(path.lastIndexOf("."),path.length);
}

Page call:

Copy code The code is as follows: