javascript - 裁剪器没有重新启动如果我没有先裁剪旧图像

Question

我的项目有问题。

我正在使用裁剪器进行图像处理。但收割机无法正常工作。当我上传图像时，显示的裁剪选项。但是如果我添加另一个图像而不裁剪第一个图像，那么裁剪器不会改变图像。

这是我的代码

function initCropper(){
    var crop_button_show = document.getElementById("crop_button_show");
    crop_button_show.style.display = "block";
    var image = document.getElementById('thumbnail_preview');
    var cropper = new Cropper(image, {   
        viewMode: 3,
        aspectRatio: 500/410,
        cropBoxResizable: false,
        minCropBoxWidth: 500,
        minCropBoxHeight: 410, 
    });

    document.getElementById('crop_button').addEventListener('click', function(){
        var imgurl =  cropper.getCroppedCanvas().toDataURL();
        var img = document.createElement("img");
        img.class = "img-responsive show-preview";
        img.src = imgurl;
        img.id = "thumbnail_preview";
        jQuery("#image_resize").empty();
        jQuery("#image_resize").append(img);

        var input = document.createElement("input");
        input.name = "image";
        input.type = "hidden";
        jQuery("#image_resize").append(input);
        $('input[name=image]').val(imgurl.replace('data:image/png;base64,', ''));
        crop_button_show.style.display = "none";
    });
}

我不知道第二次在哪里重置割草机。如果我裁剪图像然后重新上传 imgae，那么裁剪器工作得很好。

标签： javascriptjquerycroppercropperjs