Javascript 如何在模态中显示一个图像 时间轴照片 “class=“img responsive”id='image'alt=”“style='height:200px；'data toggle=“modal”data target=“#largeModal”> × 原始图像 接近

我已经从10张图片中提取了数据库，如果我点击第三张图片，我只想显示第三张图片，我不知道如何为这个问题编写代码。任何人都知道这意味着告诉我朋友们，你必须在你的页面末尾添加一个模式（for循环的外侧），并添加列表中没有模式的每个图片：

            <div class="row mt-xlg">
            <h5 class="text-semibold text-uppercase mt-lg">Timeline Photos</h5>
            <?php 
             $query1="SELECT * FROM user_photos_offline  WHERE ssmid='$ssmid' AND status='1' ORDER BY date_uploaded DESC";
             $sql=mysql_query($query1); 
             $count=mysql_num_rows($sql);   
             $results=array();
             while($row=mysql_fetch_assoc($sql)){
            // $results[]=$row['image'];
            ?>
        <div class="col-md-3">


            <img src="upload_images/<?php echo $row['image']?>" class="img-responsive" id='image' alt="" style='height:200px;' data-toggle="modal" data-target="#largeModal">
            <!--Here i am got all images from the database-->
            <!--For example i got total 10 images from database-->
            <!--For example i am clicking the 3rd image of the tatal 10 images-->


            <div class="modal fade" id="largeModal" tabindex="-1" role="dialog" aria-labelledby="largeModalLabel" aria-hidden="true" style="display: none;">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                            <h4 class="modal-title" id="largeModalLabel">Original Image</h4>
                        </div>
                        <div class="modal-body">
                            <img src="img/girl.png" class="img-responsive" id='image' alt="" style='height:400px;width:100%'>
                                <!--From here i want show only 3rd image of the tatal 10 images-->
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>

        </div>
        <?php
    }
?>
</div>  

---

我希望这能帮助你

如果我理解正确，你有很多图像，当你点击一个应该显示正确的特定图像时？尽量避免使用mysql\u查询使用PDO而不是PDO这是我的问题

<img src="upload_images/<?php echo $row['image']?>" class="img-responsive"  alt="" onclick="showImg('upload_images/<?php echo $row['image']?>')">

function showImg(url)
{
   //load your image
   $('.modal-body img').attr('src',url);
   //show modal
   $('#largeModal').modal();
}