我创建了一个PHP文件,该文件从MySQL表创建了下拉列表。选中后,我希望下拉列表中的每个条目都可以更改页面上显示的图像。我可以在下拉列表中显示最后一张图片,但是此后无法更改。
我需要使用javascript显示图像部分吗?
任何得到极大帮助的人(如果可能,请提供代码示例)
关于, 伊恩
<script language=”Javascript”>
function setImage(select){
var image = document.getElementsByName("image-swap")[0];
image.src = select.options[select.selectedIndex].value;
}
</script>
<?php
$servername = "localhost";
$username = "xxxx";
$password = "xxxxxx";
$dbname = "xxxxxx";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
// Select all data:
echo "All Tartans:<br><br>";
$sql = "SELECT ID, TartanID, Clan, Variation, Manufacturer, Supplement, SupplementVAT, ImagePath FROM Tartan";
$result = $conn->query($sql);
if ($result->num_rows > 0)
{
// output data of each row into dropdown list
?>
<select name="Tartan" id="Tartan" onchange="setImage(this);")
<?php
while($row = $result->fetch_assoc())
{
echo "ID: " . $row["ID"]. "<br>" .
"TartanID: " . $row["TartanID"]. "<br>" .
"Clan: " . $row["Clan"]. "<br>" .
"Variation: " . $row["Variation"]. "<br>" .
"Manufacturer: " . $row["Manufacturer"]. "<br>" .
"Supplement: " . $row["Supplement"]. "<br>" .
"SupplementVAT: " . $row["SupplementVAT"]. "<br>" .
"ImagePath: " . $row["ImagePath"]. "<br>";
$clan = $row["Clan"];
$img_path = $row["ImagePath"];
echo "<option value='$Clan' >$clan</option>";
}
?>
</select>
<!-- Display Image here -->
<div class="img-block">
<img src="<?php echo $img_path; ?>"
name="image-swap"
alt="<?php echo $clan; ?>"
title="<?php echo $clan; ?>"
width="200"
height="200" class="img-responsive" />
</div>
<?php
}
else
{
echo "0 results";
}
echo "<br>";
$conn->close();
?>