我试图从下拉列表中选择一个选项后出现不同的图像。我知道这可能非常基础,但我对 HTML 和 Javascript 很陌生。不确定代码在何处或为何未产生正确的输出。谢谢!
<script type = "text/javascript">
function displayImage(elem) {
var img = document.getElementById("dessert");
image.src = elem.value;
}
</script>
<form name="controls">
<select name="dessertchoice" onchange="displayImage(this);">
<option value="">None</option>
<option value="http://web.ics.purdue.edu/~lrourk/IE332/chocolate.jpg">Chocolate</option>
<option value="http://web.ics.purdue.edu/~lrourk/IE332/icecream.jpg">Ice Cream</option>
<option value="http://web.ics.purdue.edu/~lrourk/IE332/fruit.jpg">Fruit</option>
<option value="http://web.ics.purdue.edu/~lrourk/IE332/brule.jpg">Creme Brulee</option>
</select>
</br></br>
<td>
<img id="dessert" src="" style="width:300px;height:200px;"/>
</td></tr>
</form>
最佳答案
这只是一个简单的拼写错误,发生在我们最好的人身上:)
将此 image.src = elem.value;
更改为 img.src = elem.value;
这是工作示例:http://jsbin.com/jamixipiza/1/edit?html,output
希望有帮助!
关于javascript - 选择下拉选项并显示不同的图像(使用 Javascript),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32685461/