时间戳

首页 > 解决方案 > 在php中将多维数组输出为3列div和ul li

php - 在php中将多维数组输出为3列div和ul li

问题描述

这是一个数组：我试图将数组拆分为 3 列 div，第一个数组应该包装到 h3 标记中，然后其他数组应该显示在无序列表中。

Array
(
    [0] => Array
        (
            [label_01] => heading 01:
            [label_02] => heading 02: 
            [label_03] => heading 03: 
        )

    [1] => Array
        (
            [label_01] => item 01
            [label_02] => item 02
            [label_03] => item 03
        )

    [2] => Array
        (
            [label_01] => item 001
            [label_02] => item 002
            [label_03] => item 003
        )

)

它应该像这样输出

<div class="row">
    <div class="col-lg-4">
        <h3 class="text-primary text-center">heading 01:</h3>
        <ul class="list-box">
            <li class="bg-primary text-white">item 01</li>
            <li class="bg-primary text-white">item 001</li>
        </ul>
    </div>
    <div class="col-lg-4">
        <h3 class="text-warning text-center">heading 02:</h3>
        <ul class="list-box">
            <li class="bg-warning text-white">item 02</li>
            <li class="bg-warning text-white">item 002</li>
        </ul>
    </div>
    <div class="col-lg-4">
        <h3 class="text-blue text-center">heading 03:</h3>
        <ul class="list-box">
            <li class="bg-blue text-white">item 03</li>
            <li class="bg-blue text-white">item 003</li>
        </ul>
    </div>
</div>

到目前为止我已经尝试过

<div class="row">
    <?php 
    $keys = array_keys($columns);
    for($i = 0; $i < count($columns); $i++) { ?>
        <div class="col-lg-4">
    <?php foreach($columns[$keys[$i]] as $key => $value) { ?>
            <li class="bg-primary text-white"><?php echo $value; ?></li>
    <?php } ?>
        </div>
    <?php } ?>
</div>
                </div>
            <?php } ?>
            </div>

还有这个

<div class="row">
    <?php foreach ( $columns as $column ) { ?>
    <div class="col-lg-4">
            <h3 class="text-primary text-center">Inspire: Self Leadership</h3>
            <ul class="list-box">
        <?php foreach ($column as $val) { ?>
        <li class="bg-primary text-white"><?php echo $val; ?></li>
        
        <?php } ?>
        </ul>
    </div>
    <?php } ?>
</div>

任何帮助将不胜感激！先感谢您！

标签： phphtmlmultidimensional-arrayforeachwhile-loop

解决方案

首先，您的阵列不适合您想要做的事情。所以剩下2个选项；在第一种情况下，您必须首先更改数组结构（通过更改数组的键值来使循环数组更适合您的需要），第二种情况是一个小的 bir 静态解决方案，但也许它可以解决您的问题，这就是；

<?php 
$your_array = array(
    0 => array(
        'label_01' => 'heading 01:',
        'label_02' => 'heading 02:',
        'label_03' => 'heading 03:',
        ),
    1 => array(
        'label_01' => 'item 01',
        'label_02' => 'item 02',
        'label_03' => 'item 03',
        ),
    2 => array(
        'label_01' => 'item 001',
        'label_02' => 'item 002',
        'label_03' => 'item 003',
        ),
); //this is your sample array :P  

?>
<div class="row">
<?php 
$headers = $your_array[0]; // fetch the headers first... because our main loop is headers in your case...
$items = $your_array[1]; // fetch the items... we do it because your array is unordered for your needs...
$sub_items = $your_array[2]; // fetch the sub_items... we do it because your array is unordered for your needs...

foreach($headers as $key => $val) {
?>
<div class="col-lg-4">
    <h3 class="text-primary text-center"><?php echo $val; ?></h3>
    <ul class="list-box">
        <?php 
        foreach($items as $key2 => $val2) { 
            if($key2 == $key) {
        ?>
        <li class="bg-primary text-white"><?php echo $val2; ?></li>
        <?php 
            }
        } 

        foreach($sub_items as $key2 => $val2) { 
            if($key2 == $key) {
        ?>
        <li class="bg-primary text-white"><?php echo $val2; ?></li>
        <?php 
            }
        } 
        ?>
    </ul>
</div>
<?php } ?>
</div>

推荐阅读