Why IE 9 not supporting JavaScript function?

Question

I'm trying to make a function for checking file size and extension on run time, I have done it and working properly on all browser except ie 9. Can anyone let me know where the problem?

Javascript

<script type='text/javascript'>
function showFileSize() {
    var input, file;

    // (Can't use `typeof FileReader === "function"` because apparently
    // it comes back as "object" on some browsers. So just see if it's there
    // at all.)
    if (!window.FileReader) {
        bodyAppend("p", "The file API isn't supported on this browser yet.");
        return;
    }

    input = document.getElementById('fileinput');

   if (!input.files[0]) {
        bodyAppend("p", "Please select a file before clicking 'Load'");
    }
    else {
        file = input.files[0];
        var sFileName = file.name;
        var sFileExtension = sFileName.split('.')[sFileName.split('.').length - 1].toLowerCase();

        bodyAppend("p", "File Type " + sFileExtension + " is " + file.size + " bytes in size");
    }
}

function bodyAppend(tagName, innerHTML) {
    var elm;

    elm = document.createElement(tagName);
    elm.innerHTML = innerHTML;
    document.body.appendChild(elm);
}
</script>

HTML

<form action='#' onsubmit="return false;">
<input type='file' id='fileinput'>
<input type='button' id='btnLoad' value='Save' onclick='showFileSize();'>
</form>

Answer 1

IE9 does not support HTML5 File API, including FileReader() ..

A possible workaround would be to polyfill, the solution below uses Flash to provide access to the filesystem on browsers that don't support the File APIs (IE and Safari), but it does not support drag-n-drop .

• Link here

• Reference on why FileReader does not work for IE9

Answer 2

Instead, clone the input, place the clone where the original is, and move the original into a hidden form. You might have to use an iframe for this.

This would certainly work but involves some coding.