最近做一个web项目用到上传图片,于是根据个人的知识 及网上的搜集,将其总结于下:
上传图片时显示图片在页面
<input id="fileload" type="file">
<input onclick="imageshow()" type="button"></input>
<div id="show" ></div>
<script>
function imageshow(){
var file = document.getElementById("fileload").files[0];
var reader =new FileReader();
reader.readAsDataURL(file);
reader.onload=function(e){
$("#show").append("<img src=\""+this.result+"\">");
//result存贮的值即为 data:image/jpeg;base64,+图片的base64编码 其中jpeg 为图片格式,由上传的图片格式决定,可以是jpeg,png等
}
</script>
function imageshow(){
var file = document.getElementById("fileload").files[0];
var reader =new FileReader();
reader.readAsDataURL(file);
reader.onload=function(e){
$("#show").append("<img src=\""+this.result+"\">");
//result存贮的值即为 data:image/jpeg;base64,+图片的base64编码 其中jpeg 为图片格式,由上传的图片格式决定,可以是jpeg,png等
}
</script>
若想直接展示在页面上,而不点击button,则直接在<input id="fileload" type="file">套上一个 form即可:
<div type="show"></div>
<form name="myfrom" id="myform" method="post"
<div type="show"></div>
<form name="myfrom" id="myform" method="post"