<input type="file" multiple />实现多张图片上传前的本地预览这个有插件嘛？或是怎样的方法思路？
1 回答
慕村9548890
TA贡献1884条经验 获得超4个赞
<!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>
添加回答
举报
0/150
提交
取消