Javascript 在p5.js中单击按钮时更改图像

我有一个充满细胞的二维数组。我希望此单元格在按下按钮时更新图像。我想将值传递给构造函数，但出现了一些问题，它现在无法工作。我的想法是传递给构造函数映像值this.img=img，然后在show_cell函数中将映像值更改为this.img值。当我按下按钮时，当我将图像添加到构造器并显示网格时，它将启动函数。这其中没有一个是有效的。请帮帮我，这让我头疼。

你得把网格画进去。注意，

draw（）

由系统连续调用并重新绘制整个窗口，这是应用程序循环。在

draw

开始时，必须设置背景色（），然后必须绘制整个场景

按下按钮时设置状态变量（

show_grid

）：

让show_grid=false；
函数a（）{
显示网格=真；
}

根据变量的状态绘制网格：

函数绘图（）{
背景（255）；
如果（显示网格）{
grid.display（）；
}
填充（255）；
冲程（0）；
设fps=frameRate（）；
文本（“FPS:+FPS.toFixed（0），10，高度-10）；
}

如果要在单击按钮时更改图像，则

ve需要使用变量（例如
current\u img`），该变量用于绘制单元格：

类单元{
构造函数（列、行、大小）{
这个.x=列；
y=行；
这个。w=大小；
}
显示单元格（）{
图像（当前图像，this.x*this.w，this.y*this.w，this.w，this.w）；
}
}

单击按钮时，必须更改
当前_图像
：

函数a（）{
显示网格=真；
电流_img=img1；
}
函数b（）{
显示网格=真；
电流_img=img2；
}

请参见示例：


var网格；
无功电流；
var-img1；
var-img2；
函数预加载（）{
img1=loadImage（'https://raw.githubusercontent.com/Rabbid76/graphics-snippets/master/resource/texture/fish64.png');
img2=loadImage（'https://raw.githubusercontent.com/Rabbid76/graphics-snippets/master/resource/texture/ball64.png');
}
函数设置（）{
const background_btn1=选择（'BgCategory1-btn1'）；
背景1.鼠标按下（a）；
const background_btn2=选择（'bg类别1-btn2'）；
背景2.鼠标按下（b）；
设cnv=createCanvas（10001000）；
cnv.母公司（“帆布持有人”）；
网格=新网格（40）；
电流_img=img1；
} 
函数绘图（）{
背景（128）；
如果（显示网格）{
grid.display（）；
}
填充（255）；
冲程（0）；
设fps=frameRate（）；
文本（“FPS:+FPS.toFixed（0）、10、30）；
}
让show_grid=false；
函数a（）{
显示网格=真；
电流_img=img1；
}
函数b（）{
显示网格=真；
电流_img=img2；
}
类网格{
构造函数（单元大小）{
this.cellSize=cellSize；
this.numberOfColumns=地板（宽度/此.cellSize）；
this.numberOfRows=楼层（高度/此.cellSize）；
this.cells=新数组（this.numberOfColumns）；
for（var column=0；column

#BgCategory1-btn1{位置：绝对；顶部：0；左侧：0；}
#BgCategory1-btn2{位置：绝对；顶部：0；左侧：10%；}

图1
图2