Question

我将实现twitter bootstrap的轮播，以便一次显示五个项目。我的系统使用模板引擎smarty。

我已经熟悉聪明的基础知识。以下代码将显示我的所有项目：

<ul class="thumbnails">
{foreach $items as $item}
    <li class="span2">
        <div class="caption">
            <h5>{$item.title}</h5>
        </div>
        <div class="thumbnail">
            <img src="{$item.image}" alt="">
        </div>
    </li>        
{/foreach}
</ul>

不幸的是，twitter bootstrap的旋转木马需要将所有项目分成块，例如：

<ul class="thumbnails">
    <div class="item active">
        <ul class="thumbnails">
            <li class="span2 offset1">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
        </ul>
    </div>
    <div class="item">
        <ul class="thumbnails">
            <li class="span2 offset1">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
            <li class="span2">...</li>
        </ul>
    </div>
    ...
  </ul>

如何通过使用smarty的foreach循环来实现这一目标：

将5个项目放入一个div.item，接下来的5个项目放入下一个div.item，依此类推。
第一个div.item应该让课程'活跃'
每个div.item中的第一项应该是“.offset1”

Answer 1

Smarty定义了一些魔术变量，可以让你看到循环经历了多少次（有关所有细节，请参阅the documentation for {foreach}）。

在您的情况下，您想要检查：

{$item@first}打开第一个活跃的div.item
{$item@iteration is div by 5}关闭并打开下一个div.item，并给它的第一个li offset1类
{$item@last}关闭最后一个div.item是否可以被5整除

复杂的foreach与smarty显示bootstrap轮播

1 个答案: