HTML5手机移动端头像图片上传裁剪代码

一款简单实用的HTML5手机移动端头像图片上传裁剪代码，支持拖动放大缩小调整进行图片裁剪。

js代码
<scriptsrc="lib/mavatar.js"></script>
<script>
varavatar=newMavatar({el:'#avatar',backgroundColor:'#fff',fileOnchange:function(e){
console.log(e)
}});
functionclip(){
avatar.imageClipper(function(data){
alert('裁剪成功，生成的图片已覆盖在上传框内');
console.log(data);
//将图片上传至后台
avatar.upload({
url:'http://localhost:3080/profile',
name:'avatar',
data:{userName:'hzy0913',info:'someInfo'},
success:function(data){
console.log(data)
},
error:function(error){
console.log(error)
},
});
})
}
functionreset(){
avatar.resetImage();
}
//获取上传前信息
functiongetInfo(){
varfileInfo=avatar.getfileInfo();
console.log(fileInfo);
}
//获取base64
functiongetdata(){
varurldata=avatar.getDataUrl();
console.log(urldata);
}
</script>



下载

2023-11-23 01:31 上传

点击文件名下载附件
售价: 2 金币  [记录]  [购买]