2013-05-30 45 views
3

所以基本上如何篩選窗口彈出,只顯示圖像文件時,我點擊輸入類型的文件僅顯示圖像文件在輸入類型文件瀏覽窗口中?

<input type="file" /> 

任何幫助表示讚賞,我試圖找到這個

感謝

+1

ErrrQué?我不遵循,你能提供更多的細節,最新的彈出窗口等。 – Alex

+1

看看這個http://stackoverflow.com/questions/2861699/how-do-you-get-a-html-browse-button-過濾器和僅顯示圖像 – Debashis

+0

這是不可能用默認文件瀏覽器進行控制的。 'accept =「image/*」'屬性可以用於接受的文件類型,但只要顯示特定的文件類型,我相信javascript解決方案是唯一的方法。 –

回答

9

的解決方案你可以利用這一點,但它不會在所有的瀏覽器:

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

在Chrome中,你甚至可以指定格式,你llow:

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

LIVING DEMO

如果你想限制在客戶端的圖像類型you can still use JavaScript to validate it

不過,當然,你應該檢查與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 
    } 
} 
+0

你測試了你自己的演示嗎?你覺得哪些瀏覽器有效? – 2013-05-30 09:26:47

+0

@Dagon我只在Chrome上測試過它。你是對的。它不適用於其他人。 – Alvaro

+0

我發現它適用於IE,但不是FF – 2013-05-30 09:31:27

2

這不是可能。這是瀏覽器用戶界面的一部分,JavaScript無法控制它。如其他提及,您可以使用accept屬性,但該屬性尚未爲此目的而創建。

如果type屬性的值是fileaccept屬性指示類型的服務器接受的文件;否則會被忽略。該值必須是逗號分隔的唯一內容類型說明符列表。

+0

ic感謝您的信息 –

相關問題