jquery - 使用 JCrop 时更改图像

Question

我正在网站中开发一项新功能，但我陷入了困境。我显然使用 JCrop 来裁剪我网站上的图像。

我被要求实现的新功能是允许用户更改正在裁剪的图像的颜色。

我现在有 3 张图像，彩色、灰度和棕褐色。

我可以使用 javascript 更改图像标记的源，以便图像无需重新加载即可更改，但一旦启用 JCrop，我就无法执行此操作，因为它会将原始图像替换为新图像。

我以为我可以禁用 JCrop，替换图像，然后重新启用，但我做不到这样的事情。

我发现 JCrop 被破坏的示例(演示 zip 中的 example5)使用了一个对象:

jcrop_api = $.Jcrop('#cropbox');

但我以不同的方式启用 JCrop，更像示例 3:

            jQuery('#cropbox').Jcrop({
                onChange: showPreview,
                onSelect: showPreview,
                aspectRatio: 1
            });

如何销毁 JCrop 以便替换图像？还有其他方法可以做到这一点吗？

每次用户更改图像颜色时，我都可以轻松地重新加载页面，但我们都知道这并不酷。

Answer 1

最新版本有setImage功能

http://deepliquid.com/projects/Jcrop/js/jquery.Jcrop.js

var jcrop_api;  
$().ready(function() {
            initJcrop();
            function initJcrop()
            {
                jcrop_api = $.Jcrop('#cropbox');
            };
});

然后调用

jcrop_api.setImage('server/uploads/image.jpg'); 

这里有一个例子

http://deepliquid.com/projects/Jcrop/demos/tutorial5.html