使用裁剪工具裁剪图像

Question

我有一段代码如下：我想用4个属性裁剪图像：

  

top, left, width, height

我可以提醒您top,left,width,height正确地指向我想要裁剪的位置，但是当我点击按钮#crop时，它不会裁剪到我提醒的位置。任何解决方案将不胜感激。谢谢。

$(document).ready(function (e) {
    $("#crop").click(function () {
        var canvas = document.getElementById("Mystore1");
        var context = canvas.getContext("2d");
        var top = $('#face').offset().top;
        var left = $('#face').offset().left;
        var width = $('#face').width();
        var height = $('#face').height();
        var destX = top;
        var destY = left;
        var destwidth = width;
        var destheight = height;
        alert(top);
        alert(left);
        alert(width);
        alert(height);
        var imageSrc = '../../../Public/Pictures/Sample     Pictures/Desert.jpg';
        var imageObj = new Image();
        imageObj.onload = function () {
            context.drawImage(imageObj, top, left, width, height, destX, destY, destwidth, destheight);
        };
        imageObj.src = imageSrc;
    });
});