如何限制我的输入类型="文件"只接受在Firefox中不起作用的png图像文件

Question

我正在使用input type ="file",现在我的要求是我只想选择png图像,也就是当我选择浏览时应该应用"png"过滤器.

我已经提及www.w3schools.com/tags/att_input_accept.asp以下是我正在使用的代码,这适用于Chrome,但不适用于Firefox和IE.

请任何人帮助我理解我必须做的错误吗？

 <h2>Below uses accept="image/*"</h2>
 <input type="file" name="pic1" accept="image/*" /> 

 <h2>Below I need to accept only for png</h2>
 <input type="file" name="pic1" accept="image/png" /> 

这是一个小提琴链接http://jsfiddle.net/Jcgja/2/

Answer 1

您需要通过java脚本验证它.下面是java脚本验证的代码

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")
            return true;
        else {
            alert("File with " + fileName.split(".")[1] + " is invalid. Upload a validfile with png extensions");
            return false;
        }
        return true;
    }

Answer 2

w3schools页面上的浏览器支持信息不正确.

如果您查看此页面,您会看到accept它在Firefox中未实现的属性:

https://developer.mozilla.org/en/HTML/Element/Input

更新:
该accept属性现在在Firefox中实现,但没有最新版本的用户仍然无法获得支持.