我正在尝试使用从数据库中检索到的缩略图。PHP 工作正常并显示我的缩略图。我不知道如何将数据库中的id获取到JavaScript函数和getElementById
的imageID
中,以便在单击时显示为完整大小。 我可以在我的代码中做直接的JavaScript内联onsubmit
。 内联 JavaScript 正在工作;正在显示缩略图,单击时显示全尺寸,但我想使用我的数据库检索到的图像在单击时显示全尺寸图像。 你认为你能帮我写代码吗?
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<script type="text/javascript">
//function that shows full sized image of the thumbnail
function showImage(imageID) {
//first hide all images
document.getElementById('image1').style.display = 'none';
//then display the one that had its thumbnail clicked.
document.getElementById(imageID).style.display = '';
}
</script>
</head>
<body>
<h1></h1>
<?php
$host = "localhost";
$user = "root";
$pass = "";
$database = "travel1";
$conn = new mysqli($host, $user, $pass, $database);
if ($conn->connect_error)
die ("Unable to connect to database: " . $conn->connect_error );
$sql = "select * from what_to_do
where DESTINATION='NEW YORK CITY'";
$result = $conn->query($sql);
if ($result->num_rows >= 0) {
echo "<table>";
while($row = $result->fetch_assoc()) {
echo "<td>".$row["THUMBNAIL"]."</td>";
}
echo "</table>";
}
else {
echo "You have no destinations";
}
$conn->close();
?>
<p>
<img id="image1" alt="" src="images/NewYork/Pick7/9-11show.jpg"
style="display: none" />
</p>
<p>
<img alt="" src="="images/NewYork/Pick7/9-11thumb.JPG"style="width:100px;
height:100px" onclick="showImage('image1')" />
</p>
在此代码中,第二个 img 标签过早关闭,如 src="something" 等。如果该标签正确形成,我认为这应该有效吗?
否则,您只需执行类似" src="/blah"/>
希望这能回答你的问题吗?
然后对于I onclick功能,只需执行基本相同的操作即可。
假设很多,但在这里!
上面的答案是正确的,你过早地关闭了代码底部的图像标签,它应该是这样的:
<img alt="" src="images/NewYork/Pick7/9-11thumb.JPG" style="width:100px;
height:100px;" onclick="showImage('image1')" />
但除此之外,还有其他一些问题需要解决......
首先,通过在每个页面上为每个查询输入目标的特定名称,您将破坏使用数据库的目的!就像你提到的,你需要使用ID并相应地拉入数据。
为此,您需要通过让用户在上一页/部分选择目的地来定义 ID 是什么(在您的示例中,目的地列表可能适合按某种顺序排列的所有目的地,无论是升序还是降序等...PHP 有几种不同的方法。
因此,首先,按 ID 排序的查询是:
SELECT * FROM travel1 order by id desc
然后,要在单击目标链接时在URL中设置ID,下面是一个使用php将ID带到下一页的示例链接:
<a href="/destination-info.php?id=<?php echo $rows['id']; ?>">more info</a>
到达目标信息页面(这就是我所说的上述代码)后,过滤您的数据,以便您可以通过首先将其添加到页面(连接到数据库后)按 ID 访问特定目标:
<?php
if(isset($_GET['id'])){
$id = preg_replace('#[^0-9]#i', '',$_GET['id']);
$result = $con->query("SELECT * FROM travel1 WHERE id='$id' ");
while($rows = $result->fetch_assoc()) {
echo "<td>".$row["THUMBNAIL"]."</td>";
}
} else {
echo "We're having some issues...";
}
?>
上面的代码将从您的URL中获取数据库ID,该ID是从上一页(您的新目标列表)继承的,并且可以像其他链接一样回显出来,例如:
'echo "<td>".$row["THUMBNAIL"]."</td>";'
我希望这有所帮助! =D