input file 多张图片上传预览
<input type="file" multiple />
实现多张图片上传前的本地预览
这个有插件嘛？或是怎样的方法思路？
ABOUTYOU浏览 1748回答 1
1回答
-
慕村9548890
<!DOCTYPE html><head> <meta charset="UTF-8"> <title>多图预览</title></head><script> var result=document.getElementById("result"); var file=document.getElementById("file"); function readAsDataURL(){ var file = document.getElementById("file").files; var result=document.getElementById("result"); for(i = 0; i< file.length; i ++) { var reader = new FileReader(); reader.readAsDataURL(file[i]); reader.onload=function(e){ //多图预览 result.innerHTML = result.innerHTML + '<img src="' + this.result +'" alt="" />'; } } } </script> <p> <label>请选择一个文件：</label> <input type="file" id="file" multiple="multiple" /> <input type="button" value="读取图像" onclick="readAsDataURL()" /> </p> <div id="result" name="result"></div>
随时随地看视频慕课网APP
相关分类
JavaScript