input file上传图片预览其实很简单，只是没做过的感觉很神奇，今天我就扒下她神秘的面纱，其实原理真的很简单，下面通过一段代码大家都明白了。
具体代码如下所示：
<!DOCTYPE html><html><head><meta charset="utf-8" /><title></title><script src="jquery.js"></script></head><body><input type="file" multiple id="inputs"/> //multiple(多文件上传)<div id='dd'></div><script>$(document).ready(function () {$("#inputs").change(function () {var fil = this.files;for (var i = 0; i < fil.length; i++) {reads(fil<a style="color:transparent">来源gao*daima.com搞@代#码网</a>[i]);}});});function reads(fil){var reader = new FileReader();reader.readAsDataURL(fil);reader.onload = function(){document.getElementById("dd").innerHTML += "<img src='"+reader.result+"'>";};}</script></body><html>
实现上传图片直接预览，避免提交后在读取图片的冗余过程
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：input file上传 图片预览功能实例代码
转载请注明原文链接：input file上传 图片预览功能实例代码
