PHP – 简单嵌套无序列表(UL)数组

发布时间：2020-12-13 22:29:58 所属栏目：PHP教程来源：网络整理

导读：我在stackoverflow上看到了这个嵌套的UL数组问题的一些变体,但我认为我的比其他更简单.我正在寻找一个简单的数组循环,允许无限量的主题(父母)与无限量的项目(儿童),如： ul liTopic/li ul liItem/li liItem/li liItem/li liItem/li /ul/ul 我用以下代码尝试

我在stackoverflow上看到了这个嵌套的UL数组问题的一些变体,但我认为我的比其他更简单.我正在寻找一个简单的数组循环,允许无限量的主题(父母)与无限量的项目(儿童),如：

<ul>
    <li>Topic</li>
        <ul>
            <li>Item</li>
            <li>Item</li>
            <li>Item</li>
            <li>Item</li>
        </ul>
</ul>

我用以下代码尝试了这个：

<?php
$result = mysql_query("SELECT * FROM News");

$topicname = false;

while($row = mysql_fetch_array($result)) {
    if (!$row['TopicID']) {
            $row['TopicName'] = 'Sort Me';
    }
    if ($topicname != $row['TopicName']) {
        echo '<ul><li>' . $row['TopicName'] . '</li><ul>';
        $topicname = $row['TopicName'];
    }
    echo '';
    echo '<li>' . $row['NewsID'] . '"</li>';
    echo '';
}
if ($topicname != $row['TopicName']) {
    echo '</ul>';
    $topicname = $row['TopicName'];
}   
?>

上面的代码呈现如下：

* Topic A
      o News 1
      o News ...
      o News 51000
            + Topic B
                  # News 1
                  # News ...
                  # News 51000
                        * Topic C
                              o News 1
                              o News ...
                              o News 51000
                                    + Topic D
                                          # News 1
                                          # News ...
                                          # News 51000

希望代码呈现以下内容：

* Topic A
      o News 1
      o News ...
      o News 51000
* Topic B
      o News 1
      o News ...
      o News 51000
* Topic C
      o News 1
      o News ...
      o News 51000
* Topic D
      o News 1
      o News ...
      o News 51000

任何想法将不胜感激！

马克解决的问题;有可能解决这个相关的问题吗？

嗨Mark：是的,这就行了！非常有帮助,谢谢.我想知道你是否能够帮助我把它带到另一个复杂程度.如果你认为在这个问题中提出问题是不合适的,请告诉我,我会另外提出,但你的代码是可靠的,所以我想我会跟进它.

使用上面相同的代码,我希望通过选择1列,2列,3列,4列,5列等(最多10个)为用户提供查看数据的选项.数据行将被分成单独的DIV标记,行计数将包括主题和新闻项.我将使用我的CSS控制DIV标签,但我想将行计数均匀地分组到指定数量的列的DIV标签中.我希望儿童新闻项目不要与其父母和群体分开,以尽可能地分开.如果有一个断点,其中1列可以比另一列长,并且它是偶数/任意的,优先级将转到最左边的列,如：这个迷你插图：

XXX
XX
X

我不知道这有多清楚,所以这里有一个例子.如果用户选择1列,他们将看到以下30行“数据”：

<div id="Columns1Group1of1">
* Topic A
      o News 1
      o News 2
      o News 3
* Topic B
      o News 1
      o News 2
      o News 3
      o News 4
* Topic C
      o News 1
      o News 2
      o News 3
      o News 4
      o News 5
* Topic D
      o News 1
      o News 2
      o News 3
* Topic E
      o News 1
      o News 2
      o News 3
      o News 4
* Topic F
      o News 1
      o News 2
      o News 3
      o News 4
      o News 5
</div>

如果用户选择2列,他们会看到以下30行“数据”分为2组,每组包含DIV标签.巧合的是,这种情况很好地解决了：

<div id="Columns2Group1of2">        <div id="Columns2Group2of2">
* Topic A                           * Topic D
      o News 1                          o News 1
      o News 2                          o News 2
      o News 3                          o News 3
* Topic B                           * Topic E
      o News 1                          o News 1
      o News 2                          o News 2
      o News 3                          o News 3
      o News 4                          o News 4
* Topic C                           * Topic F
      o News 1                          o News 1
      o News 2                          o News 2
      o News 3                          o News 3
      o News 4                          o News 4
      o News 5                          o News 5
</div>                              </div>

如果用户选择3列,他们会看到以下30行“数据”分为3组,每组包含DIV标签.间距开始变得棘手,我愿意接受建议.

<div id="Columns3Group1of3">        <div id="Columns3Group2of3">        <div id="Columns3Group3of3">
* Topic A                           * Topic C                           * Topic E
      o News 1                          o News 1                            o News 1
      o News 2                          o News 2                            o News 2
      o News 3                          o News 3                            o News 3
* Topic B                               o News 4                            o News 4
      o News 1                          o News 5                        * Topic F
      o News 2                      * Topic D                               o News 1
      o News 3                          o News 1                            o News 2
      o News 4                          o News 2                            o News 3
</div>                                  o News 3                            o News 4
                                    </div>                                  o News 5
                                                                        </div>

如果用户选择4列,他们会看到以下30行“数据”分为4组,每组包含DIV标签.同样,我甚至不知道如何为我的插图手动分配它,但是让孩子们留在父母身边很重要.

<div id="Columns4Group1of4">        <div id="Columns4Group2of4">        <div id="Columns4Group3of4">        <div id="Columns4Group4of4">
* Topic A                           * Topic C                           * Topic D                           * Topic F
      o News 1                        o News 1                            o News 1                            o News 1
      o News 2                        o News 2                            o News 2                            o News 2
      o News 3                        o News 3                            o News 3                            o News 3
* Topic B                             o News 4                          * Topic E                             o News 4
      o News 1                        o News 5                            o News 1                            o News 5
      o News 2                      </div>                                o News 2                          </div>
      o News 3                                                            o News 3
      o News 4                                                            o News 4
</div>                                                                  </div>

解决方法

这应该做的伎俩：

$result = mysql_query("SELECT * FROM News");
$topicname = '';

// open list of topics
echo '<ul>';

// loop through topics
while($row = mysql_fetch_array($result)) {
    if (!$row['TopicID']) {
        // fake topic name for unsorted stuff
        $row['TopicName'] = 'Sort Me';
    }
    if ($topicname != $row['TopicName']) {
        if($topicname != ''){
            // had a topic name,means we opened a list
            // that hasn't been closed,close it.
            echo '</ul>';
        }
        // print this topic and open the list of articles
        echo '<li>' . $row['TopicName'] . '</li><ul>';
        // update the current topic to be this TopicName
        $topicname = $row['TopicName']; 
    }
    // the news item
    echo '<li>' . $row['NewsID'] . '"</li>';
}
if($topicname != ''){
    // we saw at least one TopicName,we need to close
    // the last open list.
    echo '</ul>';
}
// end topic list
echo '</ul>';

我认为你真正的问题是你每次打开两个列表,但只关闭一个(甚至移动列表中的最后一个块).

对于(新)问题的第二部分：

我要指出的是,对于较大的列表(比如超过300个项目),我在制作关于将列表存储在内存中并进行两次迭代而不仅仅是查询所需的计数时所做的权衡会转向另一种方式.也就是说,下面的解决方案将所有内容放入内存中,然后再次迭代以将其打印出来;另一种方法是运行两个查询,一个查找唯一的TopicNames,另一个查找列表中的项目总数.

另外,对于显示,你真的想要解决布局的一些优化,我会天真地做这个,并且每列只做一个(大致)相同数量的主题,当除法不成功时,这将向左重.你会看到你可以在哪里调整或替换一些代码来获得不同的(并且更好的？)结果.

$columns = // user specified;

$result = mysql_query("SELECT * FROM News");
$num_articles = 0;

// $dataset will contain array( 'Topic1' => array('News 1','News2'),... )
$dataset = array();
while($row = mysql_fetch_array($result)) {
    if (!$row['TopicID']) {
        $row['TopicName'] = 'Sort Me';
    }
    $dataset[$row['TopicName']][] = $row['NewsID'];
    $num_articles++;
}

$num_topics = count($dataset);

// naive topics to column allocation
$topics_per_column = ceil($num_topics / $columns);

$i = 0; // keeps track of number of topics printed
$c = 1; // keeps track of columns printed
foreach($dataset as $topic => $items){
    if($i % $topics_per_columnn == 0){
        if($i > 0){
            echo '</ul></div>';
        }
        echo '<div class="Columns' . $columns . 'Group' . $c . '"><ul>';
        $c++;
    }
    echo '<li>' . $topic . '</li>';
    // this lists the articles under this topic
    echo '<ul>';
    foreach($items as $article){
        echo '<li>' . $article . '</li>';
    }
    echo '</ul>';
    $i++;
}
if($i > 0){
    // saw at least one topic,need to close the list.
    echo '</ul></div>';
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!