上传base64编码文件

1.js进行图片预览 使用input标签来选择图片,使用FileReader读取图片并转成base64编码,然后发送给服务器。

<html>
<body>
 <img id="image"src=""/>
<br/>
 <input type="file"onchange="selectImage(this);"/>
<br/>
 <input type="button"onclick="uploadImage();"value="提交"/>
<script>
 var image = '';
 function selectImage(file){
 if(!file.files || !file.files[0]){
return;
}
 var reader = new FileReader();
 reader.onload = function(evt){
 document.getElementById('image').src = evt.target.result;
 image = evt.target.result;
}
reader.readAsDataURL(file.files[0]);
}
 function uploadImage(){

$.ajax({

type:'POST',

 url: 'ajax/uploadimage', 

 data: {image: image},

 async: false,

 dataType: 'json',

 success: function(data){

if(data.success){

alert('上传成功');

}else{

alert('上传失败');

}

},

 error: function(err){

alert('网络故障');

}

});

}
</script>
 <script src="jquery-1.11.1.min.js"></script>
</body>
</html>

 

转载于:https://www.cnblogs.com/obeing/p/5299136.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值