Php 尝试使用弹出引导创建一个简单的图像库

我试图创建一个简单的图像库，它有100x100缩略图，当你点击它时，我会使用引导弹出窗口查看所有图像的完整大小

<?php
$eventFiles1 = scandir($eventDir);
$eventFiles = array_diff($eventFiles1, array('.', '..'));

foreach($eventFiles as $eventFile)
{
    $image = "./".$eventDir."/".$eventFile;

    list($width, $height) = getimagesize($image);

    if($width > $height)
    {
        ?>
        <a data-toggle="modal" data-target="#myModal" href=""><div style="height:100px;width:100px;margin:10px;background-color:black;display:inline-block;background-position:center;background-image:url('<?php echo $image; ?>');background-size:auto 100%;"></div></a>

        <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-body">
                        <img src="<?php echo $image; ?>" class="img-responsive">
                    </div>
                </div>
            </div>
        </div>

        <?php
    }
    else
    {
        ?>
        <a data-toggle="modal" data-target="#myModal" href=""><div style="height:100px;width:100px;margin:10px;background-color:black;display:inline-block;background-position:center;background-image:url('<?php echo $image; ?>');background-size:100% auto;"></div></a>

        <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-body">
                        <img src="<?php echo $image; ?>" class="img-responsive">
                    </div>
                </div>
            </div>
        </div>
        <?php
    }
}
?>

“class=”img responsive“>
“class=”img responsive“>

就现在而言，它不能按我想要的方式工作。我会解释原因：

假设我的多媒体资料包含5幅图像（image1.jpeg、image2.jpeg……image5.jpeg） 无论单击哪个图像放大，模式中显示的图像始终是image1.jpeg

现在，我确实认为问题在于我的模型总是有相同的ID-

#myModal

，但即使我尝试给它一个动态ID，例如将ID

divModal

更改为

$image

，但这也不起作用-当我单击图像时，它根本没有发生任何事情

有人能帮我吗

---

提前感谢。

您必须为您的模式和链接添加不同的id

foreach($eventFiles as $key => $eventFile)

和html

data-target="#myModal'.$key.'"

<div id="myModal'.$key.'" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 

data target=“#myModal.”$key.”

Wow，我不敢相信解决方案会那么小和简单，但最终它是非常感谢。