javascript - 这种上传图片预览怎么做？

问题描述

类似于这种上传图片，还能预览显示的这种，前端应该怎么写，有没有类似的代码可以提供给我看看！谢谢

问题解答

var fr = new FileReader(), file = document.getElementById('file'), img = document.createElement('img');file.onchange = function(e){ fr.onload = function(e){var res = this.result;img.src = res;document.body.appendChild(img);//显示 };fr.readAsDataURL(file.files[0]);//读取文件};回答2：

web uploader.js或FileReader API

自己之前写过一个商城商品图片的预览，思路很简单，不知道对你有没有帮助：1.上传上的图片，网页上肯定显示小的缩略图吧；2.后台（我们当时是后台，你们也可以想想其他办法）存储两张图片，一张小的缩略图，一张预览的高清大图；3.点击小的缩略图时，用模态框显示大的高清图。

两个demo:点击事件https://github.com/treeandgra...图片拖拽的https://github.com/treeandgra...