How to restrict my input type=“file” to accept only (png/jpeg) image files

I wanted to restrict my input file tag to accept only .png images. I had read about this **accept attribute **provided under the input tag.

Firstly this feature is not supported by all the browsers out there (not even Firefox to some extent here is fiddle link to it).

So here is what I had to come up with to resolve this problem,

ENTER  JAVASCRIPT !

function CheckFileName() {

    var fileName = document.getElementById("uploadFile").value

    if (fileName == "")  
    {  
        alert("Browse to upload a valid File with png extension");  
        return false;  
    }  
    else if (fileName.split(".")[1].toUpperCase() == "PNG")  
    {  
        alert("A Valid Png file is attached !");  
        return true;  
    }  
    else  
    {  
        alert("Not a Png File !");  
        return false;  
    }

    return true;

}