单击图像上的区域时显示文本的 onclick

Onclick that displays the text when you click area on the image

我的网站有问题。我试图在区域上单击,当我单击图像上的区域时,我想显示图像和文本。这是我的意思的一个例子:

这是我目前创建的:


 <div class="interior" style="padding-left: 243px;">
 <img src="Pres7.png" usemap="#intr">
  <map name="intr">
   <area class="speedo" shape="circle" onclick="" coords="342,126,19" href="">
   <area class="screen" shape="circle" onclick="" coords="518,179,17" href="">
   <area class="light" shape="circle" onclick="" coords="730,229,17" href="">
   <area class="swheel" shape="circle" onclick="" coords="345,259,17" href="">
 </map>
</div>

它应该显示不同的图像和文本,所以我猜需要创建 4 个函数。

网上有好几个例子,我试过,但是给变量赋值的时候,不行。

虽然我可以通过单击来创建文本和图像,但我不知道该怎么做。

有一个叫做 'display' 的 CSS 属性,每个 HTML 元素都有它自己的属性默认值(其中大部分是“块”,这意味着它们覆盖了整个 X 轴),但是您可以为该显示 属性 提供的值之一是 'none',这意味着它是隐藏的,您可以使用 javascript 在“none"(隐藏)和您想要的值。

示例见此处:https://www.w3schools.com/howto/howto_js_toggle_hide_show.asp