html 选择图片后马上展示出来

document.getElementById('file4').onchange = function(evt) { // 如果浏览器不支持FileReader，则不处理 if (!window.FileReader) return; var files = evt.target.files; for (var i = 0, f; f = files[i]; i++) { if (!f.type.match('image.*')) { continue; } var reader = new FileReader(); reader.onload = (function(theFile) { return function(e) { // img 元素 document.getElementById('pic4').src = e.target.result; }; })(f); reader.readAsDataURL(f); } }

 jquery方法

$('.yyzz_a input').change(function(evt){ // 如果浏览器不支持FileReader，则不处理 if (!window.FileReader) return; var files = evt.target.files; for (var i = 0, f; f = files[i]; i++) { if (!f.type.match('image.*')) { continue; } var reader = new FileReader(); var obj = $(this).parent().children('label').children('img');//$(obj).remove(); reader.onload = (function(theFile) { return function(e) { // img 元素 $(obj).attr('src',e.target.result); }; })(f); reader.readAsDataURL(f); } })

 

转载于:https://www.cnblogs.com/whlives/p/5147482.html

相关资源：数据结构—成绩单生成器