当使用if / else语句单击特定图像时如何发送消息？

Question

我正在尝试进行编码，以便如果用户单击某些图像，则用户将收到描述该图片的消息。图片也将变大。这就是为什么我要在人不了解图片的情况下发出消息来描述图片。我是javascript的新手，所以我只想保持简单。这是我的下面的代码。你能告诉我我做错了什么吗？ （顺便说一下，文本是瑞典语）。

function resizeImage(image) {
   image.style.width = "70%";
   image.style.height = "auto";
   if (image == document.getElementById("#code-picture")) {
      window.alert("En bild på programmeringskod!" + "\n\nStarta om sidan för att återfå  bilden av normalstorlek.");
   } else if (image == document.getElementById("#electronics-picture")) {
    window.alert("En bild på kretskort!" + "\n\nStarta om sidan för att återfå bilden av normalstorlek.");
   }
}

HTML中的两张图片之一

<img src="images/code.jpg" alt="En bild som visar programmeringskod" id="code-picture" onclick="resizeImage(this)"/>

Answer 1

您可以通过将完整消息添加到data-description属性或alt参数来简化此操作。对于我的示例，我将使用data-description属性。

function resizeImage(image) {
   image.style.width = "70%";
   image.style.height = "auto";
   let desc = image.getAttribute("data-description").replace("\\n","\n");
   window.alert(desc);
}

<img src="images/code.jpg" data-description="En bild på programmeringskod!\nStarta om sidan för att återfå  bilden av normalstorlek." alt="En bild som visar programmeringskod" id="code-picture" onclick="resizeImage(this)"/>

Answer 2

应该是document.getElementbyId（“ code-picture”），但不是

document.getElementbyId（“＃code-picture”）。 //这是错误的

document.getElementbyId（id）仅采用要定位的元素的ID。您不应在其之前添加＃。（ID不应包含＃）