如何在PHP中基于当前页面动态地将“active”类添加到导航菜单项中？

bhmjp9jg 于 2023-05-16 发布在 PHP

关注(0)|答案(1)|浏览(82)

我的inc_header.php文件中有一个包含导航菜单的PHP脚本。

<header id="header" class="fixed-top">
  <div class="container-fluid d-flex justify-content-between align-items-center">
    <a href="index.php" class="logo">
      <img src="assets/img/logo.png" alt="IHRD logo" class="img-fluid">
    </a>
    <h1 class="logo me-auto me-lg-0">
      <a class="d-none d-lg-block" href="index.php">Technical Higher Secondary School Puthuppally</a>
      <a class="d-block d-lg-none" href="index.php">THSS Puthuppally</a>
    </h1>
    <nav id="navbar" class="navbar order-last order-lg-0">
      <ul>
        <li>
          <a href="?page=home">Home</a>
        </li>
        <li>
          <a href="?page=about">About</a>
        </li>
        <li>
          <a href="?page=admission">Admissions</a>
        </li>
        <li>
          <a href="?page=faculties">Faculties</a>
        </li>
        <li>
          <a href="?page=facilities">Facilities</a>
        </li>
        <li>
          <a href="?page=activity">Activities</a>
        </li>
        <li>
          <a href="?page=achievements">Achievements</a>
        </li>
        <li class="dropdownlist">
          <button class="dropbtn">Gallery</button>
          <div class="dropdownlist-content">
            <a href="?page=gallery">Images</a>
            <a href="?page=videogallery">Videos</a>
          </div>
        </li>
        <li>
          <a href="?page=contact">Contact</a>
        </li>
      </ul>
      <i class="bi bi-list mobile-nav-toggle"></i>
    </nav>
    <!-- .navbar -->
    <!--social links-->
  </div>
</header>

Index.php

<!DOCTYPE html>
<html lang="en">
  <head>
    <?php include('inc_metadata.php');?>
  </head>
  <body>
    <!--Header-->
    <?php include('inc_header.php');?>
    <?php
        $allowed = array('about','home','gallery','videogallery','faculties','contact','admission','facilities','activity','achievements',);
        $page = ( isset($_GET['page']) ) ? $_GET['page'] : 'index';
       if ( in_array($page, $allowed) )
           {
             include("$page.php");
             include('inc_config.php');
           }
      else {
           include("home.php");
         }
        ?>
      <!--footer-->
    <?php include('inc_footer.php'); ?>
    <?php include('inc_bottom.php'); ?>
  </body>
</html>

我想动态地将类“active”添加到
1.对应于当前页面的元素。例如，如果当前页面是“home.php”，我需要相应的
1.元素中添加类“active”。根据我的代码，导航栏被固定在'index.php'中。如何使用PHP实现这一点？我希望根据当前页面的URL动态应用活动类。谢谢你！
我试过chatgpt，但没有工作。我是一个自学成才的初学者，我希望有人能帮助我。

php

来源：https://stackoverflow.com/questions/76241641/how-to-dynamically-add-the-active-class-to-the-navigation-menu-item-based-on-t

1条答案

按热度按时间

5sxhfpxr1#

首先，你需要在测试GET值之后移动你的include。

<?php 
    $allowed = array('about','home','gallery','videogallery','faculties','contact','admission','facilities','activity','achievements',);
    $page = ( isset($_GET['page']) ) ? $_GET['page'] : 'index';
    if ( in_array($page, $allowed) )
       {
       // here you test the page you'll show, so the corresponding menu item can be checked
       // $page = $_GET['page'];
         include('inc_header.php');
         include("$page.php");
         include('inc_config.php');
       }
       else {
       include("home.php");
     }
    ?>

在菜单中，按如下所示修改链接：

<li><a href="?page=home" class="<?php if($page == "home") { echo"selected"; } ?>">Home</a></li>
 <li><a href="?page=about" class="<?php if($page == "about") { echo"selected"; } ?>">About</a></li>  
// where .selected is the CSS style you want to apply

赞(0）回复(0）举报 2023-05-16

我来回答

如何在PHP中基于当前页面动态地将“active”类添加到导航菜单项中？

1条答案

相关问题

热门标签

最新问答