计算<li>的打印次数

时间:2018-01-15 14:19:03

标签: php css

我需要检查li标签的打印次数

<li>
  <ul class="rd-megamenu-list">
    <a href="<?php echo $link; ?>" class="title"><?php echo $title; ?></a>
  </ul>
</li>

如果标签被打印4次,我需要开始一个新行。我在foreach循环中打印这些值以检索wp菜单。我得到了所有正确的唯一错误是它通过在列中添加菜单来打印一行中的所有值。

我需要设置是否使用值打印行以开始新行。

看起来应该是这样的

AUDI        BMW        MERCEDES        TOYOTA
HONDA       FERARI     RENAULT         PASSAT
SKODA       FIAT

不喜欢这样(一行中的一切)

AUDI        BMW        MERCEDES        TOYOTA HONDA       FERARI     RENAULT   ETC

完整代码

<ul class="rd-navbar-nav">
    <?php
    $count = 0;
    $submenu = false;
    foreach( $menuitems as $item ):
        $link = $item->url;
        $title = $item->title;
        // item does not have a parent so menu_item_parent equals 0 (false)
        if ( !$item->menu_item_parent ):
        // save this id for later comparison with sub-menu items
        $parent_id = $item->ID;
    ?>

    <li>
        <a href="<?php echo $link; ?>" class="title"> <?php echo $title; ?> </a>
        <?php endif; ?>

        <?php if ( $parent_id == $item->menu_item_parent ): ?>

        <?php if ( !$submenu ): $submenu = true; ?>
        <ul class="rd-navbar-megamenu">
        <?php endif; ?>
            <li>
              <ul class="rd-megamenu-list">
                <a href="<?php echo $link; ?>" class="title"><?php echo $item->title; ?></a>
              </ul>
            </li>

           <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ): ?>
        </ul>
        <?php $submenu = false; endif; ?>

        <?php endif; ?>

        <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ): ?>
    </li>
    <?php $submenu = false; endif; ?>

    <?php $count++; endforeach; ?>

</ul>

生成的HTML

<ul class="rd-navbar-nav">

    <li>
        <a href="http://localhost:8080/company/" class="title"> Početna </a>
    </li>


    <li>
        <a href="http://localhost:8080/company/o-nama/" class="title"> O nama </a>
     </li>


    <li>
        <a href="http://localhost:8080/company/termoizolacioni-paneli/" class="title"> Termoizolacioni paneli </a>
        <ul class="rd-navbar-megamenu">
            <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/termoizolacioni-paneli/krovni-paneli-2/" class="title">Krovni paneli</a>
                 </ul>
            </li> 
            <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/termoizolacioni-paneli/krovni-paneli/" class="title">Zidni paneli</a>
                </ul>
            </li>
            <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/termoizolacioni-paneli/frigo-paneli/" class="title">Frigo paneli</a>
                </ul>
            </li>
        </ul>
    </li>


    <li>
        <a href="http://localhost:8080/company/ostali-proizvodi/" class="title"> Ostali proizvodi </a>

        <ul class="rd-navbar-megamenu">
            <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Profilisani limovi</a>
                </ul>
            </li>
             <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Vijčana roba</a>
                </ul>
            </li>
             <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Komunalna oprema</a>
                </ul>
            </li>
             <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Profili za suhu gradnju</a>
                </ul>
            </li>
             <li>
                <ul class="rd-megamenu-list">
                    <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Ostali</a>
                </ul>
            </li>
        </ul>   


    </li>

</ul>

5 个答案:

答案 0 :(得分:1)

使用CSS可以实现这一点,使用这两个规则(我认为你的li元素是内联块):

.rd-megamenu-list li {
  float: left;
}
.rd-megamenu-list li:nth-child(4n+1) {
  clear: left;
}

这会将每个第4个li项放入新行。

li {
  display: inline-block;
  padding: 10px;
}

.rd-megamenu-list li {
  float: left;
}

.rd-megamenu-list li:nth-child(4n+1) {
  clear: left;
}
<ul class="rd-megamenu-list">
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
  <li>LISTITEM</li>
</ul>

这是一组类似的CSS,其中包含您添加的生成的HTML。我为所有第一级clear: left;添加了li,我不知道您是否需要它,因为这不是原始问题的一部分:

ul {
  padding: 0;
  margin-left: 10px;
}

.rd-navbar-megamenu li {
  display: inline-block;
  padding-left: 5px;
  margin: 0;
}

.rd-navbar-megamenu li {
  float: left;
}

.rd-navbar-megamenu li:nth-child(4n+1) {
  clear: left;
}

.rd-navbar-nav>li {
  clear: left;
}
<ul class="rd-navbar-nav">

  <li>
    <a href="http://localhost:8080/company/" class="title"> Početna </a>
  </li>


  <li>
    <a href="http://localhost:8080/company/o-nama/" class="title"> O nama </a>
  </li>


  <li>
    <a href="http://localhost:8080/company/termoizolacioni-paneli/" class="title"> Termoizolacioni paneli </a>
    <ul class="rd-navbar-megamenu">
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/termoizolacioni-paneli/krovni-paneli-2/" class="title">Krovni paneli</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/termoizolacioni-paneli/krovni-paneli/" class="title">Zidni paneli</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/termoizolacioni-paneli/frigo-paneli/" class="title">Frigo paneli</a>
        </ul>
      </li>
    </ul>
  </li>


  <li>
    <a href="http://localhost:8080/company/ostali-proizvodi/" class="title"> Ostali proizvodi </a>

    <ul class="rd-navbar-megamenu">
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Profilisani limovi</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Vijčana roba</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Komunalna oprema</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Profili za suhu gradnju</a>
        </ul>
      </li>
      <li>
        <ul class="rd-megamenu-list">
          <a href="http://localhost:8080/company/profilisani-limovi/" class="title">Ostali</a>
        </ul>
      </li>
    </ul>


  </li>

</ul>

答案 1 :(得分:0)

您可以使用CSS进行格式化。这将在显示4之后包装项目。您可能需要添加text-align和display属性,具体取决于CSS&gt;的其余部分

CSS

.25p { width: 24.99%; }

HTML

<li class='25p'>
  <ul class="rd-megamenu-list">
    <a href="<?php echo $link; ?>" class="title"><?php echo $title; ?></a>
  </ul>
</li>

答案 2 :(得分:0)

我在循环结束时插入了条件:

<ul class="rd-navbar-nav">
    <?php
    $count = 0;
    $submenu = false;
    foreach( $menuitems as $item ):
        $link = $item->url;
        $title = $item->title;
        // item does not have a parent so menu_item_parent equals 0 (false)
        if ( !$item->menu_item_parent ):
        // save this id for later comparison with sub-menu items
        $parent_id = $item->ID;
    ?>

    <li>
        <a href="<?php echo $link; ?>" class="title"> <?php echo $title; ?> </a>
        <?php endif; ?>

        <?php if ( $parent_id == $item->menu_item_parent ): ?>

        <?php if ( !$submenu ): $submenu = true; ?>
        <ul class="rd-navbar-megamenu">
        <?php endif; ?>
            <li>
              <ul class="rd-megamenu-list">
                <a href="<?php echo $link; ?>" class="title"><?php echo $item->title; ?></a>
              </ul>
            </li>

           <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ): ?>
        </ul>
        <?php $submenu = false; endif; ?>

        <?php endif; ?>

        <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ): ?>
    </li>
    <?php $submenu = false; endif; ?>

    <?php 
$count++; 
if ($count % 4 == 0) {
     echo '<br>';
}
endforeach; 
?>

</ul>

答案 3 :(得分:0)

您可以在php中将其分解为块:

<?php foreach( $menuitems as $item ):
  if (++$i % 4 == 0) : ?>
     </ul><ul class="rd-navbar-nav">
  <?php endif; ?>

答案 4 :(得分:0)

正如其他人所说,使用CSS是实现目标的正确方法,但在这里回答你的问题是PHP代码:

<ul>
<?php
// Array of items
$cars = array('AUDI', 'BMW', 'MERCEDES', 'YOTOTA', 'HONDA', 'FERARI', 'RENAULT', 'PASSAT', 'SKODA', 'FIAT');

// Start count at 0
$count = 0;
foreach($cars as $car){
// Add 1 to the count
$count++;
?>
    <li>
        <?=$car?>
    </li>
<?php
    // If this is the fourth element
    if($count === 4){
        // Print a line break
        echo "<br />";
        // And reset the count
        $count = 0;
    }
}
?>
</ul>

这将在每第4个元素后添加换行符。