jquery.imgareaselec.js产生截图效果,怎么生成图片,保存到数据库

选一场随意的旅行 发布于 2015/11/06 16:59
阅读 1K+
收藏 0

【领华为电脑包】容器化时代到来!跳转机分配问题终于“有救”了!>>>

@水牛叔叔 你好,想跟你请教个问题:我的代码如下:我应用的是这个jquery.imgareaselec.js,现在可以预览截图的效果,但是怎么保存截图后的图片以及保存到数据库,有些没有思路,请帮帮忙;代码如下:

<form action="youraction" method="post"> <!--获取用户选取的区域-->
<input type="hidden"id="startX" name="startX" readonly="readonly"/> <!--起始点X-->
<input type="hidden" id="startY" name="startY" readonly="readonly"/> <!--起始点y-->
<input type="hidden" id="width" name="width" readonly="readonly"/> <!--宽度-->
<input type="hidden"id="height" name="height" readonly="readonly"/> <!--高度-->
<div class="lpop_btn3"><input type="image" src="./images/set/set5_btn1.gif" alt="완료" name="submit"/>
</div>
<div class="rpop_btnn"><a href="sub04_01.html"><img src="./images/set/set1_btn2.gif" alt="취소" /></a></div>
</form>
以及部分JS

function preview(img, selection) {
if (!selection.width || !selection.height)
return;
var scaleX = 100 / selection.width;
var scaleY = 100 / selection.height;


$('#preview img').css({
width : Math.round(scaleX * 300),
height : Math.round(scaleY * 300),
marginLeft : -Math.round(scaleX * selection.x1),
marginTop : -Math.round(scaleY * selection.y1)
});

$("#startX").val(selection.x1);
$("#startY").val(selection.y1);
$("#width").val(selection.width);
$("#height").val(selection.height);
}

$(function() {
$('#photo').imgAreaSelect({
aspectRatio : '1:1',
handles : true,
fadeSpeed : 200,
onSelectChange : preview
});
});

加载中
0
水牛叔叔
水牛叔叔
图片不用保存到数据库。提交参数后,后台根据参数把上传过来的头像截成小图保存到某个目录上就行了。你只需要保存头像文件的名字就可以了
返回顶部
顶部