2

我正在使用最新版本的 jquery.jcrop。在图像上调用 jcrop() 时，裁剪工作但不会调用回调。这使得无法设置 jcrop_api 以供以后使用。具体来说，我希望能够更改图像并需要 destroy() 方法。

function setJCrop() {
    //Set image for cropping
    jQuery('#preview').Jcrop( {
        minSize : [126, 126],
        setSelect : [ 0, 0, 126, 126 ],
        //onChange: updateMeasurements,
        onSelect: updateMeasurements,
        aspectRatio: 1
    }, function() {
        jcrop_api = this;  //callback not being called
    } );
}

当切换到 jQuery 就绪函数的调用时，这种情况开始发生：

jQuery(document).ready(function($) {
4

2 回答 2

2

贾斯汀的代码几乎就是文档所说的。但是，当您使用 IE6、7、8 中的 API 重新加载图像时，它会执行一次，然后就会崩溃。为什么？因为IE有问题。

更兼容的启动 API 的方式应该是这样的。

在脚本的最外层定义您的 api。

var jcrop_api;

然后，当您需要启动 API 时，例如在同一页面上上传之后..您这样做（这行是让 IE 和其他奇怪浏览器开心的原因）我使用两个标签，因为有时我的裁剪器用于母版页我只留下它作为示例。我也没有设置任何选项，但如果你愿意，你可以。

jcrop_api = $.Jcrop($('#SourceImage, #body_SourceImage'), {});

然后对于每个图像，您可以启动裁剪器

       jcrop_api.setOptions({
            boxWidth: 500,
            onSelect: updateCoords,
            minSize: [thisImage.Min.Width, thisImage.Min.Height],
            aspectRatio: thisImage.AspectRatio  //1.3 for example
        });
        jcrop_api.setImage(uploadLocation + fileName);

重要的是，当您完成裁剪后，您必须销毁 API，然后重新启动它。再次——只是为了让所有浏览器都满意。

 jcrop_api.destroy();
于 2012-05-01T16:16:13.967 回答
0

确保首先jcrop_api在 Jcrop 调用范围之外声明变量，就像这样。列出的代码只会分配一个变量。如果您仍然怀疑回调正在执行，请放在alert()那里进行测试。

var jcrop_api;

function setJCrop() {
    //Set image for cropping
    $('#preview').Jcrop( {
        minSize : [126, 126],
        setSelect : [ 0, 0, 126, 126 ],
        //onChange: updateMeasurements,
        onSelect: updateMeasurements,
        aspectRatio: 1
    },function(){
      jcrop_api = this;
    } );
}
于 2012-04-28T08:26:07.263 回答