javascript - 使用 baguettebox 显示数据库中的图像

Question

我正在尝试使用 baguetteBox.js 显示数据库中的图像问题是，baguetteBox 与 <a> 一起使用。标签，但我用 <img> 显示图像标签。我将它们插入到我的数据库的mediumblob 中，但任何文件夹中都没有它们。 所以，这是工作的 baguetteBox:

<div class="card-buttons">
<a href="1.jpg">
<div class="kepek">
<div class="btn-group mr-2" role="group" aria-label="Second group">
<button type="button" class="btn btn-primary">Képek</button>
</div>
</a>
<a href="2.jpg"></a>
</div>

这是工作图像列表:

<?php
$sql = "SELECT id FROM cardimages ORDER BY id DESC"; 
$result = mysqli_query($conn, $sql);
while($row = mysqli_fetch_array($result)) {
?>
<img src="imageView.php?image_id=<?php echo $row["id"]; ?>" /><br/>
<?php       
}
mysqli_close($conn);
?>

但是对于这个，我看不到任何图像:

<div class="card-buttons">
<a href="1.jpg">
<div class="kepek">
<div class="btn-group mr-2" role="group" aria-label="Second group">
<button type="button" class="btn btn-primary">Képek</button>
</div>
</a>
<a href="2.jpg"></a>
<?php
$sql = "SELECT id FROM cardimages ORDER BY id DESC"; 
$result = mysqli_query($conn, $sql);
while($row = mysqli_fetch_array($result)) {
?>
<a href="imageView.php?image_id=<?php echo $row["id"]; ?>"></a>

<?php       
}
mysqli_close($conn);
?>
</div>

Answer 1

您需要使用 <img> <a> 内的标签baguetteBox 需要触发灯箱的元素。链接元素永远不会显示图像 See the second example on their homepage

因此请替换 php 文件中的这一行:

<a href="imageView.php?image_id=<?php echo $row["id"]; ?>"></a>

像这样的东西(我假设..你可能需要对其进行一些编辑)

<a href="imageView.php?image_id=<?php echo $row["id"]; ?>">
    <img src="imageView.php?image_id=<?php echo $row["id"]; ?>" />
</a>