上传问题之前检测文件大小

Question

Following is my code in which I am detecting filesize before upload but this document.getElementById('file').files[0] property is not supported by some browsers. All I wanna do is if on detecting browser doesnot support this property user gets alert of no else yes . Kindly let me know how to do this?

var filename = document.getElementById('file').files[0];
if (typeof filename === 'undefined' || filename === false)
{
alert('no');
}
     else if(filename && filename.size < 10240) { // 10485760 = 10 MB (this size is in bytes)
     alert('yes');
     $('#processing-modal').modal('show');
     return false;
     }

Answer 1

You've got it almost. Check for the property beforehand:

var element = document.getElementById('file');
if (typeof element.files !== "undefined") {
    // and now your code
}

[edit] Or as suggested here :

if (typeof FileReader !== "undefined") {
    // your code here
}

Answer 2

Indeed, IE does not support the HTML5 file API (big surprise right?)

we can simply check the files property of the input - and thus provides us with a workaround for crappy IE.

if (!this.files) alert('message');

working example: http://jsfiddle.net/whiteb0x/nHBDp/