Hi, so practicing some web development code and the part im stuck on is when a button is clicked it changes to picture and the caption is supposed to change. However no matter what i try the caption remains the same.
The following is part of the code i have.
function showImage(imageFileName)
{
// get image element
var theImageElement = document.getElementById("cameraImage");
// change what image is displayed
theImageElement.src=imageFileName;
if(cameraImage= "Canon_20d.jpg")
{
document.getElementById("imageCaption").innerHTML = "Canon 20d";
}
else if(cameraImage= "Fuji_s3Pro.jpg")
{
document.getElementById("imageCaption").innerHTML = "Fuji S3 Pro";
}
else if(cameraImage= "Fuji_9500.jpg")
{
document.getElementById("imageCaption").innerHTML = "Fuji 9500";
}
else (cameraImage= "sony_r1.jpg")
{
document.getElementById("imageCaption").innerHTML = "Sony r1";
}
}
</script>
</head>
<body>
<div id="mainContainer">
<div id="topSection">
<h1 style="text-align:center; padding-top:20px">COM301 Recipe 7: Camera e-commerce site</h1>
</div>
<div id="contentWrapper">
<div id="contentLeft">
<p style="text-align:center">Useful Links</p>
<br />
<a href="http://www.google.com">Click here for Google</a>
<br />
<a href="http://www.bbc.co.uk">Click here for BBC</a>
<br />
</div>
<div id="contentRight">
<div style="float:right; margin-top:5px; margin-right:5px">
<img id="cameraImage" src="blank.jpg" /> <br />
<div style="text-align:center" id="imageCaption"> No Image</div>
</div>
<?php
// open a file for reading
$fp = fopen("cameras.txt", "r");
if ($fp != FALSE) {
// set up the table for structured output
echo "<table border='2' width='75%' rows='4'>";
echo "<tr><th>Make</th><th>Model</th><th>Price</th><th>Rating</th><th>Stock</th><th>Image</th></tr>";
// read the data line by line
while (($buffer = fgets($fp)) != FALSE) {
// extract the component parts of the line
// remove whitespace
$buffer = trim($buffer);
$data = explode(',', $buffer);
// display the data
echo "<tr><td align='center'>$data[0]</td>
<td align='center'>$data[1]</td>
<td align='center'>$data[2]</td>
<td align='center'>$data[3]</td>
<td align='center'>$data[4]</td>
<td align='center'><input type='button' value='Image' onClick='showImage(\"$data[5]\");'/></td></tr>";
}
// close table
echo "</table>";
// close the file
fclose($fp);
}
?>
Anyone any idea how i can get the caption to change that appears beneath the picture. Thanks in advance.
