php 如何在php中制作活动导航栏?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19749793/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-25 19:58:00  来源:igfitidea点击:

How to make active navigation bar in php?

phpnavigation

提问by Sanjay Karki

Hello I'm trying to make my navigation bar active in php, so that user can know in which page they are on. I'm new to php and don't know much about it. So how can I add a class="active" in this code to make a active nav bar and display all the page in same index.php page.

您好,我正在尝试使我的导航栏在 php 中处于活动状态,以便用户可以知道他们在哪个页面上。我是 php 新手,对它了解不多。那么如何在这段代码中添加一个 class="active" 来制作一个活动导航栏并在同一个 index.php 页面中显示所有页面。

 <a href="?page=home"> Home</a></br>
<a href="?page=news"> News</a></br>
<a href="?page=about"> About</a></br>
<a href="?page=contact"> Contact</a></br>

 <?php
if (!isset($_GET['page'])) {
    include "home.php";
} else {
switch ($_GET['page']) {
    case "home":
         include "home.php";
    break;
    case "news":
         include "news.php";
    break;
    case "about":
         include "about.php";
    break;
    case "contact":
         include "contact.php";
    break;
    default:
         include "home.php";
    };
}
?>

回答by gillytech

Create an array of menu items and then use a foreachloop to generate the menu dynamically.

创建一个菜单项数组,然后使用foreach循环动态生成菜单。

That way when you add new items to the array they will show up in the menu:

这样,当您向数组添加新项目时,它们将显示在菜单中:

<html>
<head>
    <title>Website</title>

    <style type="text/css" media="screen">
        .active {
            font-weight: bold;
        }
    </style>
</head>
<body>

<?php

// This is your menu
$items = array("home", "news", "about", "contact");

foreach ($items as $item)
{
    if (isset($_GET['page']) && $_GET['page'] == $item)
    {
        echo '<a href="?page=' . $item . '" class="active"> ' . $item . '</a></br>';
        $activePage = $item . ".php";
    }
    else
    {
        echo '<a href="?page=' . $item . '"> ' . $item . '</a></br>';
    }
}

// Include your page
if (isset($activePage))
{
    include $activePage;   
}
else
{
    include "home.php";
}

?>

</body>
</html>

You should replace all of your code with this code and give it a spin. Using loops to reduce the amount of redundant markup you need to write is not only DRYbut will save you a lot of time in the future!

你应该用这个代码替换你的所有代码并尝试一下。使用循环来减少您需要编写的冗余标记量不仅是DRY,而且会在未来为您节省大量时间!

回答by subhash

You can use the PHP code below as navigation. I recommend that you use unordered list (i.e. <ul><li><a href=""></a></li></ul>) tags for navigation:

您可以使用下面的 PHP 代码作为导航。我建议您使用无序列表(即<ul><li><a href=""></a></li></ul>)标签进行导航:

<ul>
    <li<?php if($_GET['page']=="home")   { echo " class=\"active\""; } ?>><a href="?page=home"> Home</a></li>
    <li<?php if($_GET['page']=="news")   { echo " class=\"active\""; } ?>><a href="?page=news"> News</a></li>
    <li<?php if($_GET['page']=="about")  { echo " class=\"active\""; } ?>><a href="?page=about"> About</a></li>
    <li<?php if($_GET['page']=="contact"){ echo " class=\"active\""; } ?>><a href="?page=contact"> Contact</a></li>
</ul>

Then add the below style to CSS:

然后将以下样式添加到 CSS:

.active {
    font-weight: bold;
}

回答by ABC

Try this code:

试试这个代码:

    <section id="section1">
        <h2>London1</h2>
        <p>
            London is the capital city of England. It is the most populous city in the United Kingdom,
        with a metropolitan area of over 13 million inhabitants.
        </p>
        <p>
            Standing on the River Thames, London has been a major settlement for two millennia,
            its history going back to its founding by the Romans, who named it Londinium.
        </p>
    </section>


    <section id="section2" style="display:none">
        <h2>London2</h2>
        <p>
            London is the capital city of England. It is the most populous city in the United Kingdom,
        with a metropolitan area of over 13 million inhabitants.
        </p>
        <p>
            Standing on the River Thames, London has been a major settlement for two millennia,
            its history going back to its founding by the Romans, who named it Londinium.
        </p>
    </section>


    <section id="section3" style="display:none">
        <h2>London3</h2>
        <p>
            London is the capital city of England. It is the most populous city in the United Kingdom,
        with a metropolitan area of over 13 million inhabitants.
        </p>
        <p>
            Standing on the River Thames, London has been a major settlement for two millennia,
            its history going back to its founding by the Romans, who named it Londinium.
        </p>
    </section>
    <?php include 'footer.php'; ?>

    <script type="text/javascript">
    $(document).ready(function(){
        $("#1").click(function(){
            $("#section1").show();
            $("#section2").hide();
            $("#section3").hide();
        });

        $("#2").click(function(){
            $("#section1").hide();
            $("#section2").show();
            $("#section3").hide();
        });

        $("#3").click(function(){
            $("#section1").hide();
            $("#section2").hide();
            $("#section3").show();
        });
    })



    </script>

回答by unpluggeDloop

<nav class="navbar">

    <?php // var_dump($_SERVER["PHP_SELF"]);  ?>  <!-- this will show your url -->
    <a class="default-link-style <?php if($_SERVER["PHP_SELF"]=='/your-path-here-uncomment-var_dump-to-get-it/index.php'){echo 'style-active';}?>"  href="index.php">Home</a>
    <a class="default-link-style <?php if($_SERVER["PHP_SELF"]=='/your-path-here-uncomment-var_dump-to-get-it/new-page-here.php'){echo 'style-active';}?>" href="new-page-here.php">New Page Here</a>
    <a class="default-link-style <?php if($_SERVER["PHP_SELF"]=='/your-path-here-uncomment-var_dump-to-get-it/next.php'){echo 'style-active';}?>" href="next.php">Next</a>

</nav>

<style>

    .style-active {
            text-decoration: red underline overline wavy;
    }

<style>

回答by ABC

<div id="nav">
    <button id="1">London1</button><br>
    <button id="2">2</button><br>
    <button id="3">3</button><br>
</div>
<div id="nav">
    <a href="index.php">paris1</a><br>
    <a href="paris.php">pzris2</a><br>
    <a href="tokyo.php">paris3</a><br>
</div>
<?php include 'header.php'; ?>
<?php include 'nav1.php'; ?>

<?php include 'footer.php'; ?>