javascript - select 标签的更改如何触发更改 img 的 src？

Question

是否可以在选择标签中放置根据您选择的选项而变化的图像？我需要更改选择标签内与所选国家/地区匹配的旗帜图像。

Answer 1

概念验证就像这样。

HTML

<select id="select" onchange="window.changeSrc(this);">
    <option value="https://www.funnyhoop.com/wp-content/uploads/2018/06/funny-animals-1-5.jpg">First</option>
    <option value="https://pbs.twimg.com/profile_images/821849411991044096/lQFa_Vly_400x400.jpg">Second</option>
</select>
<img src="" id="img"
</body>

Javascript

window.changeSrc = function(that) {
    document.getElementById("img").src = that.value;
}
window.changeSrc(document.getElementById('select'));

fiddle :https://jsfiddle.net/2tsv3uLq/

说明

您需要一个 select 标签和一个 img 标签。 select 标签的更改将更改 img 标签的 src。