图片内的可点击元素-网页游戏

Question

我正在尝试使用React实现一个棋盘游戏，而我正在努力寻找一种方法来将UI（图像）上的棋盘方块“转换”为数据。

有没有办法为附加图像上的正方形分配某种排序ID，所以当用户单击一个正方形时，我会得到正方形的ID？

我想知道用户何时单击了图像内的某个正方形。

PS。我没有.svg图片。只能是.png文件。

Answer 1

您可以如下使用<map>和<area>标签。您可以为每个“按钮”添加更多id | name | criteria | formatted_criteria -------------------------------------------------------------------------------------------------------------- 9 | test | {"radius": "30", "location": "Manchester"} | {"Radius": "30 miles", "Location": "Manchester"} 标签，并对其进行操作。您必须稍微使用<area>。

coords

function doSomething() {
  console.log("click");
}

function doSomething2() {
  console.log("click2");
}