您的位置：首页 > 其它

2017/2/17本地上传图片展示（未向后台发送）

2017-02-17 17:01 141 查看 


<!DOCTYPE html>

<html lang="en">

<head>
<meta charset="UTF-8">
<title>Document</title>

</head>

<body>
<input type="file" id="photo">
<div id="click" style="width: 200px; height: 200px; border: 1px solid #000;"></div>
<script>

document.getElementById('photo').addEventListener('change',function(e){

console.log(this)

var files = this.files;

console.log(files)

var img = new Image();

var reader = new FileReader();

reader.readAsDataURL(files[0]);

reader.onload = function(e){
console.log(e)
var mb = (e.total/1024)/1024;
if(mb>= 2){
alert('文件大小大于2M');
return;
}
img.src = this.result;
img.style.width = "80%";
document.getElementById('click').style.width="200px";
document.getElementById('click').style.height="200px";
document.getElementById('click').innerHTML = '';
document.getElementById('click').appendChild(img);
}

});
</script>

</body>

</html>

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                上传图片
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航