HTML

Question

我希望所有动态生成的php链接都显示在下面的示例1中，当我点击链接时我转到另一个页面，其所有子链接都显示在示例2中，当我点击其中一个链接时，它的所有子链接链接显示在其他示例中。

如果有帮助，我会在我的网站上使用PHP，MySQL和Jquery。

示例1

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

示例2

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

示例3

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

示例4

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Answer 1

我会尝试的最简单的解决方案是：

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
   <?php if($page = "Some nested page"): ?>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
      </ul>
   <?php endif; ?>
   </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Answer 2

我希望所有动态生成的php链接显示为下面的例子1，当我点击一个 带我到另一页的链接所有子链接都显示之类的在示例2中，当我点击一个这些链接的所有子链接都是显示像在其余的实例

粗体部分不太清楚。

all my dynamic generated php links

它是如何动态生成的？通过ajax？请进一步解释。

takes me to another page all its sub links are displayed

如果单击链接将您带到另一个页面，则应在服务器端显示子链接。是的，你可以通过jQuery在客户端进行，但我认为这是不切实际的。

概要

使用您的php显示您的子链接。

HTML

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul class="active"> <!-- active UL -->
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

CSS

ul.active ul {
    display: none;
}

如上所述，使用您的PHP技能将活动类添加/移除到ul。通过这样做，以及CSS的定义，活动ul内的任何ul都不可见。在上文中，Fourth Nested List将不会显示在页面上。

<强>更新

ul ul {
    display: none;
}
ul.active {
    display: block; /* or display:inline; */
}

示例

<ul>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a>
      <ul>  <!-- this will be hidden and all it's sub ul -->
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
      <ul class="active"> <!-- active UL, this will be displayed on the browser -->
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a>
          <ul class="active"> <!-- this will be shown if it's closest parent ul is active also -->
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a>
              <ul>  <!-- this will be hidden and all it's sub ul -->
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
                <li><a href="link.php">Fourth Nested List</a></li>
              </ul>
            </li>
            <li><a href="link.php">Third Nested List</a></li>
            <li><a href="link.php">Third Nested List</a></li>
          </ul>
        </li>
        <li><a href="link.php">Second Nested List</a></li>
        <li><a href="link.php">Second Nested List</a></li>
      </ul>
    </li>
   <li><a href="link.php">First Nested List</a></li>
   <li><a href="link.php">First Nested List</a></li>
</ul>

Answer 3

我这样做的方法是始终将所有子菜单（和子子等）添加到你的html中，并在当前活动的主菜单，子菜单，子子菜单上设置一个活动的类等等。

然后我会使用css隐藏不属于活动类的子菜单。

这样，当有人徘徊或点击父母时，您可以轻松地弹出菜单的弹出窗口。如果你应该想要......

动态垂直菜单问题

3 个答案:

HTML

CSS