jQuery下拉菜单图像更改

jQuery Drop Down Menu Image Change

本文关键字：图像 下拉菜单 jQuery      更新时间：2023-09-26

我得到了一个要更改的下拉菜单。我在html部分得到了这个：

<h1>Configure Your GT Super Sportscar</h1>
<form id = "sport" action="">
<table width = "35%" border = "2">
<tr><th colspan = "2">Choose a Colour</th></tr>
<tr><td>
<select id = "Colour" size = "5">
<option value='0'>Black</option>
<option value='1'>Blue</option>
<option value='2'>Red</option>
<option selected="selected" value='3'>Silver</option>
<option value='4'>White</option>
</select></td>
<td><img id = "carimage" src="images/silver.jpg" alt="Car model" ></td></tr>
</table>
</form>

我收到了5张不同颜色的汽车图片：

•   images/black.jpg
•   images/blue.jpg 
•   images/red.jpg 
•   images/silver.jpg 
•   images/white.jpg

当我点击下拉菜单中的红色选项时，汽车的图片或颜色需要改变，我不知道该怎么做。

请帮忙。

你可以试试这个：

$('#Colour option').click(function(){
    $('#carimage').attr('src','images/' + $(this).text().toLowerCase() + '.jpg');
})
相关文章：