4

so basically how to filter the window popup to only show images files when i click the input type file

 <input type="file" />

any help appreciated, I try to find a solution for this

Thanks

4

4 回答 4

11

您可以使用它，但它不适用于所有浏览器：

<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
    }
}
于 2013-05-30T09:23:26.313 回答
8

我想你正在寻找接受参数。试试这个作品

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

有关 mime 类型的列表，请查看以下链接：

http://www.bitsandpix.com/entry/microsoft-office-2007-2010-docx-xlsx-pptx-mime-type-to-avoid-the-zip-issue/

于 2013-05-30T09:23:46.437 回答
2

这是不可能的。这是浏览器用户界面的一部分，JavaScript 无法控制它。正如其他提到的，您可以使用accept属性，但尚未为此目的创建该属性。

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

于 2013-05-30T09:32:12.077 回答
1

图片例如：

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

看到这个答案

于 2013-05-30T09:25:45.887 回答