javascript - 我正在尝试在我的 Canvas 中实现撤消选项

Question

我正在尝试在我的 Canvas 中实现撤消和重做选项。我在我的程序中使用以下代码:

var cPushArray = new Array();
var cStep = -1;
function cPush()
{
    cStep++;
    if (cStep < cPushArray.length)
    {
        cPushArray.length = cStep;
    }
    cPushArray.push(document.getElementById("drawingCanvas").toDataURL());
}

function cUndo()
{
    if(cStep > 0)
    {
        cStep--;
        var canvasPic = new Image();
        canvasPic.src = cPushArray[cStep];
        canvasPic.onload = function() { ctx.drawImage(canvasPic,0,0);}
    }
}
function cRedo()
{
    if(cStep < cPushArray.length-1)
    {
        cStep++;
        var canvasPic = new Image();
        canvasPic.src = cPushArray[cStep];
        canvasPic.onload = function() {ctx.drawImage(canvasPic,0,0);}
    }
}

但是如果我调用 cPush() 方法，我无法在我的 Canvas 上绘制任何东西。你能告诉我上面的代码哪里错了吗？

Answer 1

不要使用 onload 事件，因为它仅由 DOM 就绪事件触发。

var canvasPic = new Image();
canvasPic.src = cPushArray[cStep];
//if ctx has get the context of canvas, draw the pic immediately
ctx.drawImage(canvasPic,0,0);