试图让 HTML Radio 触发显示图像的功能答案

【问题标题】：trying to get HTML Radio to trigger a function to show image试图让 HTML Radio 触发显示图像的功能
【发布时间】：2020-04-28 03:36:19
【问题描述】：

我试图让它在单击径向时显示图像并在选择另一个时将其删除

function showprediction()
{
    var Radio= document.getElementByName("tf");
    if(type[0] == true)
    {
        var img = document.create('img');
        img.src= "images/FlatPhoto.jpg";
        document.getElementById('body').appendChild(img);  
    }
    else if(type[1] == true)
    {
        var img = document.create('img');
        img.src= "images/RoundPhoto.jpg";
        document.getElementById('body').appendChild(img);  
    }
}'''

【问题讨论】：

您能帮我处理一下您的 html 代码吗.. 还有什么时候必须显示哪个图像？什么时候需要移除？
这是HTML的相关代码<label>True</label> <input type="radio" id="true" name="tf" value="true"> <label>False</label> <input type="radio" id="false" name="tf" value="false"> <img src="images/FlatPhoto.jpg" name="flat"/> <img src="images/Roundphoto.jpg" name="round"/>
也是比较隐蔽的小错误他们
您提到您必须删除该元素，但我在代码中没有看到它。

标签： javascript html image function radio-button

【解决方案1】：

例子：

    let imgs = document.querySelector('#imgs')
    let create_img
    imgs.addEventListener('change', e =>{
      if(create_img)
        create_img.remove()
      create_img = document.createElement('img')
      create_img.setAttribute('src', e.target.value)
      document.body.appendChild(create_img)
    })

<div id="imgs">
      Image 1 <input type="radio" value="https://img.ibxk.com.br/2020/01/30/30021141299110.jpg?w=1120&h=420&mode=crop&scale=both" name="img">
      Image 2 <input type="radio" value="https://cdn.pixabay.com/photo/2012/11/21/17/02/lion-66898_960_720.jpg" name="img">
</div>

在这里，我创建了一个包含输入的 div，并从该 div 中检查是否通过“更改”事件单击了这些输入之一，如果发生这种情况，它将使用输入值添加图像

【讨论】：

嘿，这对保存的图像有效吗？我应该将它添加到准备好的文档中
只要把保存的图片目录放在value里