Javascript 影响画布的按钮

我正在尝试用html5的画布创建一个简单的绘图应用程序，我使用教程作为我的基础。我正在尝试创建一个按钮，该按钮将删除当前选定的项目。但是我知道如何用html创建一个按钮，然后让按钮访问

CanvasState

函数。在本教程中，画布的所有功能（鼠标向下、鼠标向上、选择等）都是通过类似

CanvasState.prototype.getMouse=function（e）

的方式添加的，那么如何在HTML

Delete

中添加一个按钮，并使Delete（）成为

CanvasState

的函数呢，或者至少可以访问其实例变量？

画布就像位图图像，您不能向其中添加元素。
在您的教程中，只要单击鼠标及其坐标，就会生成一个正方形
位于直角坐标下，直角坐标更改为鼠标坐标
它看起来像拖拽一样。

我就是这样解决的。 创建按钮

<button id="delete">Delete</button> 

因此，当函数中有函数时，我们不会混淆上下文：

myState = this;

肮脏的工作

myState.delete_button.onclick = function() {
      if(myState.selected_index != -1){        
        myState.shapes.splice(myState.selected_index, 1);
        myState.selected_index = -1;
        myState.selection = null;
        myState.valid = false;
      }
  } 

myState.delete_button.onclick = function() {
      if(myState.selected_index != -1){        
        myState.shapes.splice(myState.selected_index, 1);
        myState.selected_index = -1;
        myState.selection = null;
        myState.valid = false;
      }
  }