Img源更改取决于从select中选择的选项
Img source change depend on chosen option from select
我解决了这个问题。我刚刚删除了VAR iimg并添加到函数中
document.getElementByID("compareimg1").src = "../images/galaxy_s4.png";
表单标签:
<form>
<select id="select1" onchange="func1()">
<option disabled selected value="choose1">
CHOOSE
</option>
<option value="i2g" id="i2g">
iPhone 2g
</option>
</select>
</form>
表格标签:
<table id="comparetable1" class="ib5" border="1">
<tr>
<td id="logotd">
<img src="../images/logo.png" id="logoimg" />
</td>
<td id="compareimg1td">
<img id="compareimg1" />
</td>
<td id="compareimg2td">
<img src="../images/galaxy_s.png" id="compareimg2" />
</td>
</tr>
</table>
脚本:
<script>
var ip2g = document.getElementById("i2g");
var iimg = document.getElementById("compareimg1").src;
function func1(){
if (ip2g.selected === true){
iimg = "../images/galaxy_s4.png";
}
}
</script>
问题是,当我从下拉菜单中选择一个选项时,它不会在表中加载图像。
问题是typeof iimg
是string
,因此更新iimg
不会更改图像src(只有对象通过引用传递)。
所以你需要:
var ip2g = document.getElementById("i2g");
var iimg = document.getElementById("compareimg1");
function func1(){
if (ip2g.selected === true){
iimg.src = "../images/galaxy_s4.png";
}
}
比较select值并像这样更改src怎么样?
var iimg = document.getElementById("compareimg1");
function func1(){
if (document.getElementById("select1").value == "i2g"){
iimg.src = "../images/galaxy_s4.png";
}
}
相关文章:
- CKeditor:更改对话框中的默认选择选项
- 如何在从多选下拉列表中选择选项值时动态生成文本框
- AngularJs列表ng单击以选择选项转换
- 使用基于文本的 Jquery 选择选项
- 当选择值x时,Javascript需要在正确的位置显示文本区域,从而循环通过具有选择选项的表单
- 在php和mysql中选择选项.一旦选择了选项,就列出我的sql数据库数据
- 选择选项时如何显示警报
- 使用php动态更改选择选项
- 选择“选择选项”时显示文本.怎么做
- LEAFLET地图和带有选择选项的标记-ANGULARjs
- 使用js将动态内容添加到选择选项列表中
- 用于使用javascript循环选择选项
- AngularJS-选择选项并在函数中使用它
- 禁用/启用基于单选/选择选项所选Javascript的文本框
- 如何使用jQuery隐藏与选择选项相关的选择选项列表
- 选择选项是添加或删除事件
- 使用jQuery向“选择选项”添加默认属性
- 构建HTML选择字段并使用JavaScript数组选择选项
- 带有动态选择选项的Firefox html5验证异常
- 只有当Angular从资源对象检索数据时,才选择选项元素