通过 html5 FileReader 实现上传图片预览功能
生活随笔
收集整理的這篇文章主要介紹了
通过 html5 FileReader 实现上传图片预览功能
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
為什么80%的碼農都做不了架構師？>>> ??
Html?部分
<!DOCTYPE?html> <html><head><meta?charset="utf-8"><title></title></head><body><input?type="file"?name="file"?onchange="showPreview(this)"?/><img?id="portrait"?src=""?width="70"?height="75"></body></html>JS部分
<script?type="text/javascript">function?showPreview(source)?{var?file?=?source.files[0];if?(window.FileReader)?{var?fr?=?new?FileReader();fr.onloadend?=?function(e)?{document.getElementById("portrait").src?=?e.target.result;};fr.readAsDataURL(file);}} </script>轉載于:https://my.oschina.net/furw/blog/493920
總結
以上是生活随笔為你收集整理的通过 html5 FileReader 实现上传图片预览功能的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Linux服务器配置秘钥对连接
- 下一篇： ActiveMQ BrokeUrl的配置