JavaScript上传文件大小

Question

I need help with file size on upload. i'd like to add file maximum size 2MB.

I use javascript code and i'm not good with javascript so if you guys can add file size into my code. Thanks.

 var _validFileExtensions = [".jpg", ".jpeg", ".png"]; function Validate(oForm) { var arrInputs = oForm.getElementsByTagName("input"); for (var i = 0; i < arrInputs.length; i++) { var oInput = arrInputs[i]; if (oInput.type == "file") { var sFileName = oInput.value; if (sFileName.length > 0) { var blnValid = false; for (var j = 0; j < _validFileExtensions.length; j++) { var sCurExtension = _validFileExtensions[j]; if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) { blnValid = true; break; } } if (!blnValid) { alert("Sorry, " + sFileName + " is invalid, allowed extensions are: " + _validFileExtensions.join(", ")); return false; } } } } return true; } 

Answer 1

This is the code I ended up writing

It can still be optimized in various ways, so its open for any performance, semantic or refactoring edits. I am not an expert.

Code Explained

1. In var _maxFilsize you have to write size of max file size to be allowed in bytes.
2. Function Validate has parameter oForm which expects an HTML object , through which it can search for input fields.
3. Store all input elements in an array, arrInputs .
4. Store value of arrInputs[i].type in string form in variable inputType
5. Compare the value of inputType with different input types in if/else statements.
6. When condition is met, each block returns a function that validates the matched input field
7. Function validateImage takes an argument which is simply the input field's property that contains list of files selected by user, arrInputs[i].files .
8. In validateImage Function there is a for loop that iterates over the list of files and validates their type and size , and returns true or false depending upon validity of file.

Code

var _maxFilesize = 2000000;// in bytes
function Validate(oForm) {
    var arrInputs = oForm.getElementsByTagName("input");
    var inputType;
    var i = 0;
    var arrLength = arrInputs.length;
    for (i; i < arrLength; i++) {
        inputType =arrInputs[i].type.toString();
        if (inputType === "file"){
            return validateImage(arrInputs[i].files);//calls function for validating image
        }else if(inputType === "email"){
            //call email validating function
        }//add validation for more fields
    }
}
function validateImage(file){
    var j = 0;
    var NumberOfFiles = file.length;
    for(j; j< NumberOfFiles;j++){
        if ((file[j].type === "image/jpeg" || file[j].type === "image/png")&& (file[j].size)<= _maxFilesize){
            return true //or whatever you want to do here like calling a function to upadate view, or something
        }
        else{
            return false //or whatever you want to do here like calling a function to upadate view, or something
        }
    }
}