jquery.jcrop.js是一個(gè)基于jQuery的圖片裁剪插件，可以幫助用戶在Web應(yīng)用中方便地進(jìn)行圖片裁剪操作。下面我們來(lái)看一下它的API。

// 初始化jCrop
$('#image').Jcrop({
// 設(shè)置裁剪框大小及最小大小
aspectRatio: 1,
minSize: [50, 50],
// 設(shè)置預(yù)覽框
boxWidth: 500,
boxHeight: 500,
onSelect: updatePreview,
onChange: updatePreview
});
// 裁剪完畢事件
function updatePreview(c) {
if (parseInt(c.w) >0) {
var scaleX = $('#preview-box').width() / c.w;
var scaleY = $('#preview-box').height() / c.h;
$('#preview-img').css({
width: Math.round(scaleX * $('#image').width()) + 'px',
height: Math.round(scaleY * $('#image').height()) + 'px',
marginLeft: '-' + Math.round(scaleX * c.x) + 'px',
marginTop: '-' + Math.round(scaleY * c.y) + 'px'
});
}
}

上面是最基本的使用示例，我們可以通過(guò)設(shè)置aspectRatio屬性來(lái)指定裁剪框的寬高比，通過(guò)minSize來(lái)指定最小裁剪尺寸。同時(shí)，我們可以設(shè)置onChange和onSelect事件來(lái)實(shí)時(shí)更新預(yù)覽框的內(nèi)容。

除此之外，還有一些常用的API：

// 獲取當(dāng)前裁剪框尺寸、坐標(biāo)和圖片實(shí)際尺寸
var bounds = $('#image').data('Jcrop').getBounds();
// 銷毀jCrop對(duì)象
$('#image').data('Jcrop').destroy();
// 重新設(shè)置裁剪框大小
$('#image').data('Jcrop').setOptions({aspectRatio: 1});
// 改變當(dāng)前裁剪框的大小及位置
$('#image').data('Jcrop').setSelect([x, y, w, h]);

以上就是jquery.jcrop.js的一些基本API使用方法，希望可以對(duì)大家有所幫助。