jquery实现截取pc图片_jquery 上传图片自由截取

为了使用户能自定义个人头像，需要提供一个对上传图片的截图功能，当前很多网站特别是SNS类网站都提供这样的功能，非常实用。本文主要是利用jQuery的imgAreaSelect插件实现。

首先引入三个文件：

前段主要代码：初始化所选择截取的图片

$('#photo').imgAreaSelect({

aspectRatio: '1:1',

handles: true

, fadeSpeed: 200

, onSelectChange: preview

// , onSelectEnd: someFunction

});

设置所选区域大小值，与坐标：

function preview(img, selection) {

if (!selection.width || !selection.height)

return;

var scaleX = 100 / selection.width;

var scaleY = 100 / selection.height;

$('#left').val(selection.x1);

$('#top').val(selection.y1);

$('#w').val(selection.width);

$('#h').val(selection.height);

}

实现代码：前台

//上传图片

$("#File1").change(function () {