程序员最近都爱上了这个网站  程序员们快来瞅瞅吧!  it98k网:it98k.com

本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

暂无数据

select 标签的更改如何触发更改 img 的 src?

发布于2023-09-17 18:56     阅读(1029)     评论(0)     点赞(15)     收藏(5)


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


解决方案


概念证明就是这样。

超文本标记语言

<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'));

小提琴:https://jsfiddle.net/2tsv3uLq/

解释

你需要一个select标签和一个img标签。标签的改变select将会改变标签src的值img




所属网站分类: 技术文章 > 问答

作者:黑洞官方问答小能手

链接:http://www.qianduanheidong.com/blog/article/531385/b939ed7f91c0c5d3bd18/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

15 0
收藏该文
已收藏

评论内容:(最多支持255个字符)