Javascript jQuery:cropit是否要删除图像数据并替换为新数据？

我正在使用

cropit.js

jquery插件在浏览器中裁剪图像。 插件网站是

我遇到的问题是，我正在根据单击的图像动态加载图像

第一个图像加载良好，一切正常。但是，如果我单击第二个图像或任何其他图像，它不会加载到裁剪区域，并且由于某种原因，第一个图像总是卡在裁剪区域中

我试图创建一个提琴来解释这一点，但我认为由于一些安全原因，外部图像不会使用cropit.js加载。另外，jsfiddle不允许http:url，因此我无法启动并运行fiddle。但我的代码结构如下：

您只需在一个简单的html文件中本地运行此操作，所有图像都与html文件位于同一文件夹中。此外，还需要包括cropit.js

这是我的全部代码：

$('.position').live('click', function(){
    var img = $(this).attr('src');
    alert(img);

    // Re-enables the cropper.
    // Does the opposite to `disable` method.
    $(function() {
        $('.image-editor').cropit({
            imageBackground: true,
            imageBackgroundBorderWidth: 20,
            imageState: {
                src: ''+img+'',
            }
         });

         $('.rotate-cw').click(function() {
             $('.image-editor').cropit('rotateCW');
         });

         $('.rotate-ccw').click(function() {
              $('.image-editor').cropit('rotateCCW');
         });

         $('.export').click(function() {
             var imageData = $('.image-editor').cropit('export', {
                 type: 'image/webp',
                 quality: .9,
                 originalSize: true
              });
         });
     });
});

正如您在我的代码中看到的，我试图在cropit

src

函数中使用变量

img

。这只起作用一次

imageState: {
    src: ''+img+'',
}

有人能就这个问题提出建议吗？因为我真的把头撞在墙上了

---

提前感谢。

您已将整个

cropit

代码包装在

$（function（）{}）中块。我认为这不是您想要的，因为该函数仅在您第一次单击时启动。您可以通过在该函数中抛出警报并单击几次来看到它失败；它只在第一次单击时启动

如果您只是删除
$（function（）{}）阻止应该触发的其余代码，这可能会解决您的问题。
您已将整个
cropit
代码包装在
$（function（）{}）中块。我认为这不是您想要的，因为该函数仅在您第一次单击时启动。您可以通过在该函数中抛出警报并单击几次来看到它失败；它只在第一次单击时启动

如果您只是删除
$（function（）{}）阻止应该触发的其余代码，这可能会解决您的问题。
您需要使用-
$（'.image editor'）.cropit（'destroy'）
您需要使用-
$（'.image editor'）.cropit（'destroy'）
您是否尝试在src上使用replace？我在设置src时使用replace有更好的效果。image.src=src.replace（“旧”、“新”）@Mmcgowa3，您认为我应该在哪里使用replace（）？在您设置新类的地方，尝试用具有new class属性的映像的新实例替换映像src。您尝试过在src上使用replace吗？我在设置src时使用replace有更好的效果。image.src=src.replace（“旧”、“新”）@Mmcgowa3，您认为我应该在哪里使用replace（）？在设置新类的地方，尝试用具有new class属性的映像的新实例替换映像src。不幸的是，这也不起作用。代码仍然会触发一次！不幸的是，这也不起作用。代码仍然会触发一次！