顯示所選圖像的縮略圖

我需要在HTML表單中的選定圖像附近顯示縮略圖。顯示所選圖像的縮略圖

<form action="upload_file.php" method="post" 
enctype="multipart/form-data"> 
<label for="file">Filename:</label> 
<input type="file" name="file" id="file" /> 
<br /> 
<input type="submit" name="submit" value="Submit" /> 
</form>

另外我寫了move_uploaded_file函數作爲php部分。我需要的是提交表單之前我需要顯示我選擇的圖像的縮略圖。我該如何實現這個目標？

來源

2011-03-21 Deepak

我不認爲你寫了'move_uploaded_file'函數，對不起:)嘗試使用一些thumbnailer庫例如http://phpthumb.sourceforge.net/ – fabrik 2011-03-21 10:32:34

@fabrik：我的上傳代碼就像move_uploaded_file（$ _ FILES [「file」] [「tmp_name」]，「upload /」。$ _FILES [「file」] [「name 「]）;它正在上傳。 – Deepak 2011-03-21 10:35:25

這只是一個笑話，暗示你是你提到的函數的作者。對不起，如果太糟糕:)認真，嘗試使用phpthumb我認爲即使他們的網站上也有一些例子。 – fabrik 2011-03-21 10:37:39

由於現代瀏覽器中的安全限制，如果沒有實際上傳文件，則不再可能實現此功能。

在一些瀏覽器，它不再是可以鏈接到本地圖像
IE7 +和FF3 +（我想其他的現代瀏覽器，太）將不會展示完整的圖像路徑任何更多的，但改爲提供C:\Fakepath樣式路徑。

來源

2011-03-21 10:29:13 Unicron

這不是真的，這要歸功於HTML5的fileData API。 – fabrik 2011-03-21 10:40:11

@fabrik爲什麼不作爲一個答案作爲例子，它會得到*我* upvote ...但是，該API將無法在IE中工作（包括9） – Unicron 2011-03-21 10:41:44

有一個關於MDC的鏈接提及但它現在不工作（Chrome/Firefox的）http://stackoverflow.com/questions/5256620/are-i-can-preview-the-image-file-who-uploaded-by-user-in-the-browser/5256653＃5256653 – fabrik 2011-03-21 10:43:35

我推薦使用fabrik推薦的縮略圖圖片。

如果你想自己做（或者，如果你只是想了解它是如何做）：

您需要處理使用iframe（因爲AJAX不支持文件上傳）圖像的上傳然後您可以使用上傳的圖像創建一個元素（通過從AJAX調用獲取ID或通過某種約定來實現），並將其放在任何需要的位置。

我相信Coding Freak推薦的解決方案將無法工作。我不記得DOM能夠提供完整的目錄到用戶使用輸入選擇的文件。據我所知，你只能訪問文件的名稱（不是所有的目錄）......這顯然是出於安全原因。

還有可能使用Java applet（EWWW）或Flash（只是一點點）。或者，如果你想要前衛，可以使用HTML5的File API，但很多瀏覽器都不支持它。

來源

2011-03-21 10:42:48 Mamsaac

嘗試HTML5Rocks' example。它做你想要的。

來源

2011-03-21 10:49:07 fabrik

顯示所選圖像的縮略圖

回答

相關問題