javascript - 单击一个页面时如何更改页面上的所有照片

Question

我有一个页面，顶部有水平幻灯片放映，下面有很多照片与上面水平幻灯片放映中的照片相对应。下页上的图片应取决于在上一节中单击的图像。因此，当单击顶部幻灯片中的一张照片时，它会触发下面所有图片的更改。现在我还不知道该怎么做。这是我到目前为止的代码。

这将创建顶部幻灯片。

    <?php
if($_GET){
    $galname = $_GET['galname'];
// gallery settings
$itemsPerPagep = '10';         // number of images per page    
$thumb_widthp  = '150';        // width of thumbnails
$thumb_heightp = '220';         // height of thumbnails
$src_folderp   = 'admin/showroom/'.$galname.'';             // current folder
$src_filesp    = scandir($src_folderp); // files in current folder
$extensionsp   = array(".jpg",".jpeg",".png",".gif",".JPG",".JPEG",".PNG",".GIF"); // allowed extensions in photo gallery

此代码一张一张地呼应幻灯片图片

if( isset($filesp[$ip]) && is_file( $src_folderp .'/'. $filesp[$ip] ) ) { 
      echo '<a href"#" id="imgsft'.$ip.'" style="cursor:pointer" onClick="">
      <div class="thumb2" style="text-align:center;">
      <span style="padding-bottom:15px;">'.$placep = substr($filesp[$ip], 0 , (strrpos($filesp[$ip], '.'))).'</span>
               <img src="'. $src_folderp .'/'. $filesp[$ip] .'"width="'.$thumb_widthp.'" height="'.$thumb_heightp.'" alt="" style="padding-top:15px;"/>
            </div>  
            </a>'; 

并且此代码与页面下部的图像相呼应

<?php
include_once("resources/init.php");
include_once("db_conx.php");
$sql = "SELECT * FROM photos WHERE id= '62'";
$query = mysqli_query($db_conx, $sql);
    while ($row = mysqli_fetch_array($query, MYSQLI_ASSOC)) {
        $description = $row["description"];
        $filename = $row["filename"];
        $thumb1 = $row["thumb1"];
        $thumb2 = $row["thumb2"];
        $thumb3 = $row["thumb3"];}
?>

在“id= 62”的最后一部分，我需要这个“id”变量能够根据上面的幻灯片索引 id# 更改为正确的 id 号。

当点击图片时，如何让这个id变量更改为相应图片的正确id，导致下页的所有照片相对于数据库行中存储的内容发生变化

Answer 1

如果我过于简单化/误解了您的问题，请告诉我，但您需要发出 AJAX 请求或在单击图像时重新加载页面。您可以通过使每个图像成为链接或添加在您单击图像时执行的 javascript 来实现。然后，您可以将请求中的图像标识符传递给后端并在那里使用该参数。