function updateCoords(c) { var img = document.getElementById('Img1'); var ctx = document.getElementById('myCanva').getContext('2d'); try { wdthScale = wdthScale === 1 ? $('#Img1')["0"].width / 222 : wdthScale; heightScale = heightScale === 1 ? $('#Img1')["0"].height / 238 : heightScale; } catch (e) { } //绘制canvas画布 ctx.drawImage(img, c.x, c.y, c.w * wdthScale, c.h * heightScale, 0, 0, 200, 200); }
另外就是处理保存按钮来，一个ajax来提交canvas形成的图片的base64字符串，后台接受保存就可以了。
var data = document.getElementById('myCanva').toDataURL(); $.ajax({ url: '/xxxx', type: 'POST', dataType: 'JSON', cache: false, data: { 'imgData': data }, success: function(res) {}, error: function(err) {} });
这就是上传裁切（实时预览）的全部过程了。
以上所述是小编给大家介绍的node.js（express）中使用Jcrop进行图片剪切上传功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章: