JS如何上传并在网页显示图片
刚才没事研究了一下怎么JavaScript 怎么上传图片...算是以后用到可以直接黏贴吧哈哈
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>上传图片</title>
</head>
<body>
<div class="yanzRight">
<input name="evidence" οnchange="uploadImg(this,'preview')" type="file"/>
<span class="dui" id="imgOrder_dui" style="display: none;"></span>
</div>
<div id="preview">
<img src="" alt="" id="imghead5" height="200" width="200" />
</div>
</body>
<script>
function uploadImg(file,imgNum){
var widthImg = 200; //显示图片的width
var heightImg = 200; //显示图片的height
var div = document.getElementById(imgNum);
if (file.files && file.files[0]){
div.innerHTML ='<img id="upImg">'; //生成图片
var img = document.getElementById('upImg'); //获得用户上传的图片节点
img.onload = function(){
img.width = widthImg;
img.height = heightImg;
}
var reader = new FileReader(); //判断图片是否加载完毕
reader.onload = function(evt){
if(reader.readyState === 2){ //加载完毕后赋值
img.src = evt.target.result;
}
}
reader.readAsDataURL(file.files[0]);
}
}
</script>
</html>
扫一扫
856
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
