Question

我遇到了jquery Jcrop插件的问题

我用它来允许用户裁剪图像，但当他/她对此不满意时，我设置重置原始图像。

我使用PHP来存储原始图像和裁剪图像。

当用户点击重置按钮时，原始图像从服务器加载并重新应用jcrop。

亲爱的朋友们，我的问题是，当用户点击“重置图片”按钮时，裁剪后的图片和原始图片都会显示。有一个没有id或类的新标签是由Jcrop创建的，并且在我destry jcrop时它没有删除。

下面是我的重置按钮代码

    $("#reset_crop").click(function(){
    refreshImg($("#profpic"), "files/"+fileName);

/ * refreshImg函数在图像url末尾的Date（）处添加日期以忽略缓存。并将src attr更改为原始文件名。 * /

    $(this).attr("disabled","disabled");
    jcrop.destroy();
    $("#profpic").on('load',function(){ jcrop = createJcrop();  });

    });

我的Jcrop设置

function createJcrop(){


return  $.Jcrop("#profpic",{
            boxWidth:345,
            trueSize:[width, height],
            width:345,
            onSelect: showCoords,
            onChange: showCoords


        }); 

}

裁剪按钮的功能是

    $("#crop").click(function(){
    jcrop.release();
    var newfile;
        jcrop.destroy();
        $.ajax({
        url:'crop.php',
        async:false,
        data:{fileName:fileName,width:coordinates[0],height:coordinates[1],x:coordinates[2],y:coordinates[3]},
        success:function(data){
                //console.log(data);
                    newfile = data;
            },
        error:function(){

                alert("something went wrong");
            }

    });


    refreshImg($("#profpic"), "files/"+newfile);
    $("#reset_crop").removeAttr('disabled');

$(this).attr("disabled","disabled");

});

Jquery Jcrop插件多次加载图像

0 个答案: