Javascript 将画布数据保存到数组时出现问题

Javascript 将画布数据保存到数组时出现问题,javascript,jquery,image,html,canvas,Javascript,Jquery,Image,Html,Canvas,我正在使用HTML5画布创建一个web应用程序来绘制图像(如绘制web),我试图实现“撤消”(ctrl+Z)和“重做”功能,在这里,我面临一个画布元素数组的奇怪问题。 有时,当我按ctrl+Z键撤消时,会出现一个空白图像,但是数据在数组中,我指向正确的元素(因为当我使用撤消/重做时,我会以正确的顺序获得正确的图像) 如果您能看一下下面的代码,我将不胜感激,我已经花了很多时间,但我无法找到问题…:-( 任何解决方案或解决方法,我都会采用,非常感谢!!我已经实现了撤销/重做功能好几次了,虽然由于许可

我正在使用HTML5画布创建一个web应用程序来绘制图像(如绘制web),我试图实现“撤消”(ctrl+Z)和“重做”功能,在这里,我面临一个画布元素数组的奇怪问题。 有时,当我按ctrl+Z键撤消时,会出现一个空白图像,但是数据在数组中,我指向正确的元素(因为当我使用撤消/重做时,我会以正确的顺序获得正确的图像)

如果您能看一下下面的代码,我将不胜感激,我已经花了很多时间,但我无法找到问题…:-(


任何解决方案或解决方法,我都会采用,非常感谢!!

我已经实现了撤销/重做功能好几次了,虽然由于许可原因我无法发布代码,但我可以给你一些伪代码,它们应该可以演示撤销/重做实际上有多么简单:

首先,您需要两个数组。将它们称为“undo”和“redo”

每次状态更改时,将该状态推送到撤消堆栈

当用户按下ctrl-z(撤消)时,从撤消堆栈中弹出上次保存的状态。将此状态推送到重做队列,并使其成为当前状态

当用户按下ctrl-y(重做)时,从重做队列中弹出上次保存的状态

如果其中一个数组开始填充超过要保存的状态数,请使用shift放弃最早的状态

有关push、pop和shift的参考,请参见

此外,您可能会发现自己希望有一个peek,因此:

Array.prototype.peek = function () {
    var theArray = this;
    var temp = theArray.pop();

    if (temp !== undefined) {
        theArray.push(temp);
    }

    return temp;
};

编辑:我的代码片段中有一个错误,在空数组上调用.peek()将推送未定义的数据。

我已经实现了几次撤消/重做功能,虽然由于许可原因,我无法发布代码,但我可以给您一些伪代码,这些伪代码应该演示撤消/重做实际上有多么简单:

首先,您需要两个数组。将它们称为“undo”和“redo”

每次状态更改时,将该状态推送到撤消堆栈

当用户按下ctrl-z(撤消)时,从撤消堆栈中弹出上次保存的状态。将此状态推送到重做队列,并使其成为当前状态

当用户按下ctrl-y(重做)时,从重做队列中弹出上次保存的状态

如果其中一个数组开始填充超过要保存的状态数,请使用shift放弃最早的状态

有关push、pop和shift的参考,请参见

此外,您可能会发现自己希望有一个peek,因此:

Array.prototype.peek = function () {
    var theArray = this;
    var temp = theArray.pop();

    if (temp !== undefined) {
        theArray.push(temp);
    }

    return temp;
};

编辑:我的代码片段中有一个bug,调用.peek()空数组上的push未定义。

javascript数组有push、pop和shift。我不确定是否有理由对任何对此帖子感兴趣的人进行所有的模块划分和索引。我的代码有效,我只是忘记了著名的img.onload函数…这会导致我的应用程序中出现空白图片javascript数组有push、pop和shift。我不确定是否有理由对任何对此帖子感兴趣的人进行所有的模块划分和索引。我的代码工作正常,我只是忘记了著名的img.onload函数…它会在我的应用程序中产生空白图片。谢谢,听起来不错,我会从头再来一次谢谢,听起来不错,我会做到的从头开始