我想显示数据库中的所有图像，但我只能显示一个答案

【问题标题】：I want to display all images in the database but i was only able to display one我想显示数据库中的所有图像，但我只能显示一个
【发布时间】：2018-10-03 06:15:23
【问题描述】：

<?php foreach ($query as $row){if(!($row->image_name=="0") ){?>

<div id="jssor_1" style="position:relative;margin:0 auto;top:20px;left:0px;width:1350px;height:800px;overflow:hidden;visibility:hidden;">
    <!-- Loading Screen -->
    <div data-u="loading" class="jssorl-009-spin" style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-color:rgba(0,0,0,0.7);">
        <img style="margin-top:-19px;position:relative;top:50%;width:38px;height:38px;" src="<?php echo base_url(); ?>file/images/spin.svg" />
    </div>
    <div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:1350px;height:800px;overflow:hidden;">
        <div>
            <img data-u="image" src="<?php echo base_url(); ?>rg_admin/uploads/<?php  echo $row->image_name; ?>" />
            <img data-u="thumb" src="<?php echo base_url(); ?>rg_admin/uploads/<?php  echo $row->image_name; ?>" />
        </div>

    </div>
    <!-- Thumbnail Navigator -->
    <div data-u="thumbnavigator" class="jssort101" style="position:absolute;left:0px;bottom:0px;width:980px;height:100px;background-color:#000;" data-autocenter="1" data-scale-bottom="0.75">
        <div data-u="slides">
            <div data-u="prototype" class="p" style="width:190px;height:90px;">
                <div data-u="thumbnailtemplate" class="t"></div>
                <svg viewbox="0 0 16000 16000" class="cv">
                    <circle class="a" cx="8000" cy="8000" r="3238.1"></circle>
                    <line class="a" x1="6190.5" y1="8000" x2="9809.5" y2="8000"></line>
                    <line class="a" x1="8000" y1="9809.5" x2="8000" y2="6190.5"></line>
                </svg>
            </div>
        </div>
    </div>
    <!-- Arrow Navigator -->
    <div data-u="arrowleft" class="jssora106" style="width:55px;height:55px;top:400px;left:30px;" data-scale="0.75">
        <svg viewbox="0 0 16000 16000" style="position:absolute;top:0;left:0;width:100%;height:100%;">
            <circle class="c" cx="8000" cy="8000" r="6260.9"></circle>
            <polyline class="a" points="7930.4,5495.7 5426.1,8000 7930.4,10504.3 "></polyline>
            <line class="a" x1="10573.9" y1="8000" x2="5426.1" y2="8000"></line>
        </svg>
    </div>
    <div data-u="arrowright" class="jssora106" style="width:55px;height:55px;top:400px;right:30px;" data-scale="0.75">
        <svg viewbox="0 0 16000 16000" style="position:absolute;top:0;left:0;width:100%;height:100%;">
            <circle class="c" cx="8000" cy="8000" r="6260.9"></circle>
            <polyline class="a" points="8069.6,5495.7 10573.9,8000 8069.6,10504.3 "></polyline>
            <line class="a" x1="5426.1" y1="8000" x2="10573.9" y2="8000"></line>
        </svg>
    </div>

</div>
<script type="text/javascript">jssor_1_slider_init();</script>   <?php } }?>

我想显示数据库中的所有图像，但我只能显示一个

【问题讨论】：

您的 HTML 过于复杂。尝试简化 HTML，只在循环中显示图像标签以查看图像是否显示。
您正在循环中创建多个具有相同 ID 的 div。

标签： php html css slider jssor

【解决方案1】：

要创建多个幻灯片，您需要渲染多个 div。

<div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:1350px;height:800px;overflow:hidden;">
    <div>
        <img data-u="thumb" src="<?php echo base_url(); ?>rg_admin/uploads/<?php  echo $row->image_name; ?>" />
    </div>
    <div>
        <img data-u="thumb" src="<?php echo base_url(); ?>rg_admin/uploads/<?php  echo $row->image_name; ?>" />
    </div>

</div>

【讨论】：