Question

我有一个列表项Album包含30张专辑。

我尝试在浏览器中显示所有这些内容，其中1行包含3个项目。

代码如下：

<div class="container">
    <div class="row">
        foreach($listAlbum as $item) {
            <div class="col-md-4">$item['imgUrl']</div>
        }
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
        <div class="col-md-4"></div>
    </div>
</div>

注意：我希望每个人继续循环所有.col-md-4。

如果我再次使用foreach(listAlbum)通过每个.row。它会复制，我不想要这个。

有任何想法解决我的问题吗？

修改： .col-md-4中的完整结构：

<div class="news-post standard-post">
  <div class="post-gallery">
    <a href="Album_Detail.html"><img src="upload/news-posts/st1.jpg" alt=""> </a>
  </div>
  <div class="post-content">
    <h2><a href="Album_Detail.html">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</a></h2>
    <ul class="post-tags">
      <li><i class="fa fa-clock-o"></i>27-Nov-2016</li>
      <li><a href="#"><i class="fa fa-comments-o"></i><span>23</span></a></li>
    </ul>
  </div>
</div>

Answer 1

您需要$listAlbum项目的计数器。增加每个项目的计数器并检查它是否可被3整除。如果它可被3整除，则重新打开行标记：

<?php
$listAlbum = [
  ['imgUrl' => 'url1'],
  ['imgUrl' => 'url2'],
  ['imgUrl' => 'url3'],
  ['imgUrl' => 'url4'],
  ['imgUrl' => 'url5'],
];

echo "<div class='container'>\n\t<div class='row'>\n";

$i = -1;
foreach ($listAlbum as $item) {
  if (++$i && $i % 3 == 0)
    echo "\t</div>\n\t<div class='row'>\n";
  echo "\t\t<div class='col-md-4'>", $item['imgUrl'], "</div>\n";
}

if (++$i % 3)
  echo str_repeat("\t\t<div class='col-md-4'></div>\n", 3 - $i % 3);

echo "\t</div>\n</div>";

示例输出

<div class='container'>
    <div class='row'>
        <div class='col-md-4'>url1</div>
        <div class='col-md-4'>url2</div>
        <div class='col-md-4'>url3</div>
    </div>
    <div class='row'>
        <div class='col-md-4'>url4</div>
        <div class='col-md-4'>url5</div>
        <div class='col-md-4'></div>
    </div>
</div>

Answer 2

试试这个：

<div class="container">
<div class="row">
    <?php $col = 0; foreach($listAlbum as $item) {
        if($col && !($col%3)){echo '</div><div class="row">';}
        ?>
        <div class="col-md-4">$item['imgUrl']</div>
    <?php $col++; } ?>
</div>
<div class="row">
    <div class="col-md-4"></div>
    <div class="col-md-4"></div>
    <div class="col-md-4"></div>
</div>
<div class="row">
    <div class="col-md-4"></div>
    <div class="col-md-4"></div>
    <div class="col-md-4"></div>
</div>

示例代码：

<?php
for($i=1;$i<30;$i++){
$listAlbum[]= 'item '.$i;
}
 ?>
<div class="container">
    <div class="row">
    <?php $col = 0; foreach($listAlbum as $item) {
    if($col && !($col%3)){echo '</div><div class="row">';}
    ?>
       <div class="col-md-4"><?php echo $item ?></div>
     <?php $col++; } ?>
    </div>

Answer 3

试试这个，我不确定$ item的内容[＆＃39; imgUrl＆＃39;]

   <div class="container row">
        <div class="col-md-12">
           <?php foreach($listAlbum as $item) { ?>
                <div class="col-md-4"> <?php $item['imgUrl'] ?></div>
            <?php } ?>
        </div>
    </div>

如何在一行中显示每个3项并继续循环结束？

3 个答案: