带有 PHP 的菜单活动项

Question

我正在尝试为每个站点制作带有活动类的菜单。

我不知道我做错了什么。 感谢您的帮助：D

<li class="nav-item <?php echo $home; ?>">
<a class="nav-link" href="/">Home</a>
</li> 
<li class="nav-item <?php echo $hry; ?>">
<a class="nav-link" href="/hry">Hry</a>
</li> 
<?php
  $host = $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];
  if($host == 'myurl.com/') {
    $home = 'active';
  }
  elseif ($host == 'myurl.com/hry')  {
    $hry = 'active';
  }
  else {
  $home = 'non-active';
  $hry = 'non-active';
  }
  ?>

Answer 1

查看您的代码，我发现问题出在这里：您在 HTML 之后设置变量$home $hry 。

您应该在输出 html 之前设置它们。 应该是这样的：

<?php
  $host = $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];
  if($host == 'myurl.com/') {
    $home = 'active';
  }
  elseif ($host == 'myurl.com/hry')  {
    $hry = 'active';
  }
  else {
    $home = 'non-active';
    $hry = 'non-active';
  }
?>
<li class="nav-item <?php echo $home; ?>">
<a class="nav-link" href="/">Home</a>
</li> 
<li class="nav-item <?php echo $hry; ?>">
<a class="nav-link" href="/hry">Hry</a>
</li> 

Answer 2

你总是可以写一个辅助函数：

function checkIfActive($route){

    if(strpos($_SERVER['REQUEST_URI'], $route) !== false){
        return "is-active";
    }
    return null;
}

并为每个菜单项将辅助函数插入到您的 html 中。 它将根据您输入的字符串检查其是否处于活动状态

<li class="nav-item <?php checkIfActive('string_for_home_url') ?>">
<a class="nav-link" href="/">Home</a>
</li> 
<li class="nav-item <?php checkIfActive('string_for_hry_url'); ?>">
<a class="nav-link" href="/hry">Hry</a>
</li> 

一旦您的应用程序和菜单项开始增长，这对您来说会容易得多