Question

我正在使用foreach循环输出从Instagram API获取的图像。我希望将输出的图像分成四和五的组，除此之外，为每个组添加一个div元素，除了最后一个应该添加2个div的组，所以我得到以下结构：

<div class="group>
    <div class="extra"> </div>
    <img/>
    <img/>
    <img/>
    <img/>
</div> <!-- Close group of 5 -->
<div class="group>
    <div class="extra"> </div>
    <img/>
    <img/>
    <img/>
    <img/>
    <img/>
</div> <!-- Close group of 6 -->
<div class="group>
    <div class="extra"> </div>
    <img/>
    <img/>
    <img/>
    <div class="extra"> </div>
</div> <!-- Close group of 5 -->

通过在循环中使用模数，我设法在每个组中使用正确数量的项目对元素进行分组，但是当我尝试将额外的div添加到每个组时，它会破坏计数而且我不再将正确数量的元素组合在一起。我目前用于打印图像的代码（共12个）：

  <div class="group"> <!-- Open group-wrapper -->

  $count = 0;

  foreach($decoded_results['data'] as $item) {

      if ($count  % 11 == 0 || $count % 11 == 5 ) {
          echo '<div class="extra"> </div>'; 
          echo '</div> <div class="group">';
      }

      echo '<a target="_blank" href=' .$link_url. '>';
      echo '<div class="img-wrapper">';
      echo '<img src="'.$image_link.'" /> </div> </a>';

      $count++;   
  }

有关如何实现这一目标的任何建议吗？

Answer 1

这足以指出你正确的方向：

# Create data.frame with shading info
shading <- data.frame(min = seq(from = 0.5, to = max(as.numeric(as.factor(mtcars$carb))), by = 1),
           max = seq(from = 1.5, to = max(as.numeric(as.factor(mtcars$carb))) + 0.5, by = 1),
           col = c(0,1))

# Plot
ggplot() +
  geom_bar(data = mtcars, mapping = aes(factor(carb))) +
  geom_rect(data = shading,
            aes(xmin = min, xmax = max, ymin = -Inf, ymax = Inf,
                fill = factor(col), alpha = 0.1)) +
  scale_fill_manual(values = c("white", "gray53")) +
  geom_bar(data = mtcars, mapping = aes(factor(carb))) +
  coord_flip() +
  guides(fill = FALSE, alpha = FALSE)

另一方面，您应该知道在<div class='group'> <div class='extra'></div> <?php $i = 1; $j = 1; $step = 4; $count = count($decoded_results['data']); foreach($decoded_results['data'] as $k => $v) { ?> <a target='_blank' href='<?php echo $v;?>'> <div class='img-wrapper'> <img src='<?php echo $v;?>' /> </div> </a> <?php if (($j % $step) == 0 && $i < $count) { ?> </div> <div class='group'> <div class="extra"></div> <?php $step = ($step == 4) ? 5: 4; $j = 0; } $j++; $i++; } ?> <div class='extra'></div> </div>（内联元素）中包含div（块元素）并不是完全语义的HTML，但现在仍然被广泛接受。我个人倾向于避免使用CSS。

Answer 2

如果您正在使用PHP，请使用array_chunk（）函数 http://php.net/manual/en/function.array-chunk.php

Foreach循环：以五个和六个为一组拆分元素

2 个答案: