這篇文章主要介紹了JS實現圖片預覽的兩種方式,非常不錯,具有參考借鑒價值,需要的朋友可以參考下
考慮到用戶體驗, 網頁的圖片上傳資料庫前,先預覽是很有必要的一個步驟,第一可以給用戶帶來安全感,第二防止圖片檔案有問題而提交到資料庫,佔用儲存資源。
那麼要實現預覽有兩種方式:一種是用window.URL.createObjectURl方法對選擇的圖片資料(可以勉強理解為input的value)產生一個blob物件路徑,第二種是用取得FileReader讀取器。
那麼無論那種方法,首先都得得到文件數據,得到文件數據是從files集合中獲取。
方式一:
程式碼如下:
##