javascript - 单击按钮将不同的图片加载到一个

Question

如果这是一个简单的问题，我很抱歉，但我卡住了:我想在文本中单击按钮时在一个 div 框中加载不同的图片(一次只能显示一张图片)。

我很确定我有语法错误，因为我是 Javascript 的新手，但无法找到适用于谷歌的答案。

function showByUrl(Url)
{
    document.getElementById("my-image").setAttribute('src', Url);
}

然后我有指定的div:

<div id="my-image" style="float:left; width:500px; margin-left:150px;margin-top:50px; ">

以及要单击的按钮之一:

<input type="button" id="buttonText" value="Joseph" onclick="showByUrl({Url:https://telebasel.ch/wp-content/uploads/2016/03/Josefskirche.jpg});"  />

非常感谢您的帮助!谢谢大家!

Answer 1

您需要一个图像元素来显示图像:

<img id="my-image" style="float:left; width:500px; margin-left:150px;margin-top:50px; "/>

您不能将图像显示为 div(将其视为一个分区，而不是容器)，您需要在图像中使用它。检查here了解更多信息