在输入类型文件浏览窗口中只显示图像文件


Show only image files In input type file browse window?

那么当我点击输入类型文件

时如何过滤窗口弹出只显示图像文件
 <input type="file" />

感谢任何帮助,我试图找到一个解决方案

谢谢

你可以这样做,但并不是在所有浏览器中都有效:

<input type="file" accept="image/*">

在Chrome中,你甚至可以指定你允许的格式:

<input type="file" accept="image/x-png, image/gif, image/jpeg" />
生活演示

如果你想限制图像类型,你仍然可以使用JavaScript在客户端验证它。

当然,你也应该在PHP服务器端检查它:

//defining the allowed extensions and types for our system.
$allowedMimes = array('image/gif', 'image/jpeg', 'image/jpg', 'image/png', 'image/bmp', 'image/wbmp');
$allowedExtensions = array('jpg', 'gif', 'jpeg', 'png', 'bmp', 'wbmp');
$extension = end(explode('.',$imgFile));
//is the extension allowed?
if(in_array($extension, $allowedExtensions)){
    //getting the mime type (it can be different from the extension) Be careful!
    $imgInfo = getimagesize('yourPath/'.$imgFile);
    $type = strtolower($imgInfo['mime']);
    //checking the mime type
    if(!in_array($type, $allowedMimes)){
         // is an allowed image type
    }
}

我认为你正在寻找accept参数。Try this works

<input type="file" accept="image/*" />

有关mime类型的列表,请查看下面的链接:

http://www.bitsandpix.com/entry/microsoft -办公室- 2007 - 2010 -多克斯xlsx pptx mime类型- -避免- zip issue/

这不可能。这是浏览器用户界面的一部分,JavaScript无法控制它。如前所述,您可以使用accept属性,但该属性尚未为此目的创建。

如果type属性值为file,则accept属性表示服务器接受的文件类型;否则它将被忽略。该值必须是一个逗号分隔的唯一内容类型说明符列表。

图片示例:

<input type="file" accept="image/*">

查看答案