jquery - cropper - ¿Cómo elimino jcrop?

jcrop laravel

Question

¿Cómo desenvuelvo una imagen?

Estoy agregando jcrop con un;

$(''#imgThumbnailer'').Jcrop({
    onChange: statusCrop,
    onSelect: statusCrop,
    bgColor: ''black'',
    bgOpacity: .3
});

¿Cómo hago para deshacerlo?

Editar:

$(''#imgThumbnailer'').attr("src", $obj.attr(''thumbnailer_link''));

var dlg = $("#ThumbnailDialog").dialog({
    modal: false,
    draggable: false,
    position: ''center'',
    zIndex: 99999,  // Above the overlay
    closeText: '''',
    width: 510,
    height: 500,
    open: function () {
        $(''body'').css("overflow", "hidden");
        if ($.browser.msie) {
            $(''html'').css("overflow", "hidden");
        }
        $("#loader").show();

        var ratio = parseFloat($obj.attr(''thumbnailer_ratio''));
        jcrop_api = $.Jcrop(''#imgThumbnailer'', {
            onChange: statusCrop,
            onSelect: statusCrop,
            bgColor: ''black'',
            bgOpacity: .3,
            aspectRatio: ratio
        });

    },
    close: function () { $(''body'').css("overflow", "auto"); if ($.browser.msie) { $(''html'').css("overflow", "auto"); } $("#loader").hide(); },
    buttons: {
        ''Set Thumbnail'': function () {
            $(this).dialog(''close'');
        },
        Cancel: function () {
            jcrop_api.destroy();
            jcrop_api = null;
            $(this).dialog(''close'');
        }
    }
}).parent();
dlg.appendTo(jQuery(''form:first''));

El código anterior no funcionará para mí. Creo que esto tiene que ver con el hecho de que estoy usando esto dentro de un diálogo de jQuery. http://code.google.com/p/jcrop/issues/detail?id=21

No estoy seguro exactamente de cómo arreglarlo.

Answer 1

A partir de la versión v0.9.9 de Jcrop, debe hacerlo de la siguiente manera:

var jcrop_api;
$(''#target'').Jcrop(options,function(){
    jcrop_api = this;
});

Cortesía del creador: http://deepliquid.com/content/Jcrop_API.html

Answer 2

Editar: Parece que necesitas mantener una referencia a la api cuando agregas jcrop a una imagen.

// assign jcrop to jcrop_api
var jcrop_api = $.Jcrop(''#imgThumbnailer'', {
    onChange: statusCrop,
    onSelect: statusCrop,
    bgColor: ''black'',
    bgOpacity: .3
});


// when you want to remove it
jcrop_api.destroy();

Answer 3

Me preguntaba lo mismo y, después de leer la fuente, he encontrado una solución simple que funciona en v0.9.8 (las otras respuestas publicadas solo funcionan con la versión dev actualmente). Si inicia Jcrop de esta manera:

$(''#imgThumbnailer'').Jcrop({
    onChange: statusCrop,
    onSelect: statusCrop,
    bgColor: ''black'',
    bgOpacity: .3
});

entonces puedes acceder a la api y destruir Jcrop a través de:

JcropAPI = $(''#imgThumbnailer'').data(''Jcrop'');
JcropAPI.destroy();

Probablemente sea demasiado tarde para el autor de la pregunta, ¡pero espero que esto sea útil para alguien que se encuentra en esta página de google!