Question

我正在遍历值列表，并且有22个以上的值。我只想显示最多3个值和一个单击更多按钮，以便它可以根据用户要求显示所有值。

我对如何做到这一点感到困惑。

这是我之前做过的事情，当您单击加号时将显示所有记录，而单击减号时将隐藏所有记录

我们是否必须限制sql查询中的数字值，还是有一种PHP方法可以显示三个记录，然后使用Javascript显示所有记录？

帮助姐姐出去^^

<table>
        <thead>
            <tr>
                <th>Std Id</th>
                <th>List of Names</th>
            </tr>
        </thead>
        <tbody>
        <?php
             foreach ($Names as $key => $name): ?>
            <tr>
                <td><?= $key ?></td>
                <td class="collapse-control collapse-plus">
                    <?php
                        $students = [];
                        foreach($name as $r){
                            if(!in_array($r->getStudent(), $students ))
                                $students []=$r->getStudent();
                            ?>
                            <span class="form-names d-none"><?= $row->getName()?><br> </span>
                    <?php } ?>
                </td>

            </tr>
        <?php endforeach; ?>
        </tbody>
    </table>

脚本

  $(document).ready(function() {
    $('.collapse-control').on('click', function(e) {
        var $cell = $(this).toggleClass('collapse-plus collapse-minus');
        $cell.find('.form-names').toggleClass('d-none');
    });
});

Answer 1

您可以使用循环显示PHP中的所有数据（就像您所做的一样）。现在，您只需要在循环内添加一个条件。告诉循环以显示前三项，而没有display:none的任何样式或类，然后其余的将具有类或样式。这个想法是这样的：

$counter = 0;    
foreach($name as $r)){ // your loop here

  if($counter < 3){ //show the first 3 items
    echo  "<span class='form-names'>".$row->getName()."</span>";
  }else{ //show the rest items but hide it
    echo  "<span class='form-names' style='display:none'>".$row->getName()."</span>";
  }

$counter++;//add a counter
}

然后，您现在可以触发一个按钮，单击该按钮将显示所有.form-names。或者，您可以使用现有的JQuery切换功能。

无需使用array_slice，您只需添加一个counter变量来检查项目是否大于3。使用该方法可以正常显示前3个项目（没有{{1}样式}），但其余项目将以display:none的样式循环播放，因此将其隐藏在网页上（但它已经在DOM中加载了）。

如何显示foreach循环中的前3个值，单击时如何显示该行中的所有值

1 个答案: