Limit the size of a file upload (html input element) Ask Question

Limit the size of a file upload (html input element) Ask Question

I would like to simply limit the size of a file that a user can upload.

I thought maxlength = 20000 = 20k but that doesn't seem to work at all.

I am running on Rails, not PHP, but was thinking it'd be much simpler to do it client side in the HTML/CSS, or as a last resort using jQuery. This is so basic though that there must be some HTML tag I am missing or not aware of.

Looking to support IE7+, Chrome, FF3.6+. I suppose I could get away with just supporting IE8+ if necessary.

Thanks.

ベストアンサー1

const uploadField = document.getElementById("file");

uploadField.onchange = function() {
    if(this.files[0].size > 2097152) {
       alert("File is too big!");
       this.value = "";
    }
};

This example should work fine. I set it up for roughly 2MB, 1MB in Bytes is 1,048,576 so you can multiply it by the limit you need.

Here is the jsfiddle example for more clearence:
https://jsfiddle.net/7bjfr/808/

おすすめ記事