Question

我来自Java背景，并且从未真正需要foreach循环，但由于职业和个人学习，我正在深入研究php。我仍然试图绕过他们并努力在其中加入一个条件。我相信我可能会使用一个关键数组，但我完全迷失了。如果你能解释如何实现这一点，加上最佳实践。

在这里你可以尝试合并的foreach循环：

  <?php foreach ($products as $product) { ?>

    <?php if ($product['thumb']) { ?>
    <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>
    <?php } ?>

  <?php } ?>

进入这个：

<div class="container">
    <div class="col-md-12">
        <h1>In the Spotlight</h1>

        <div class="well">
            <div id="myCarousel" class="carousel slide">
                <ol class="carousel-indicators">
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                    <li data-target="#myCarousel" data-slide-to="1"></li>
                    <li data-target="#myCarousel" data-slide-to="2"></li>
                </ol>
                <!-- Carousel items -->
                <div class="carousel-inner">
                    <div class="item active">
                        <div class="row">
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                        </div>
                        <!--/row-->
                    </div>
                    <!--/item-->
                    <div class="item">
                        <div class="row">
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                        </div>
                        <!--/row-->
                    </div>
                    <!--/item-->
                    <div class="item">
                        <div class="row">
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                            <div class="col-md-3"><a href="#x" class="thumbnail"><img class="img-responsive" src="http://placehold.it/250x250" alt="Image" style="max-width:100%;"></a>
                            </div>
                        </div>
                        <!--/row-->
                    </div>
                    <!--/item-->
                </div>
                <!--/carousel-inner--> <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>

                <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
            </div>
            <!--/myCarousel-->
        </div>
        <!--/well-->
    </div>
</div>

提前感谢那些帮助

的人

Answer 1

这是一个如何做到这一点的粗略示例。它非常愚蠢，但它完成了工作，你应该能够理解它。

<?php 

// echo code from the start .. until <div class="carousel-inner"> <div class="item active">

$inserted = 0;
foreach ($products as $product) { 
    if (array_key_exists('thumb', $product) && !empty($product['thumb'])) {
        ++$inserted;
        // echo '... code from each row, e.g. <div class="col-md-3" ....',

        if ($insert % 4 == 0)  { // call this for every 4 images
            // echo the end of the row
        }

        if ($insert == 12) {
            // echo the final part because we displayed 12 items now
            break; // exit the loop after the 12 items
        } else {
            // echo the start of a row again because we haven't got 12 yet
        }
    }
}

?>

对于每个循环进入bootstrap滑块

1 个答案: