下拉菜单中的活动类

Question

我在header.php中使用这段代码

<?php $activePage = basename($_SERVER['PHP_SELF'], ".php"); ?>

这是在导航中

<li class="<?= ($activePage == 'about') ? 'active':''; ?>"><a href="/about/"><strong>About Us</strong></a></li>
<li class="<?= ($activePage == 'contact') ? 'active':''; ?>"><a href="/contact/"><strong>Contact Us</strong></a></li>

下拉代码如下：

<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">It will be active class <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
    <li><a href="/Link-1/">Link1</a></li>
    <li><a href="/Link-2/">Link2</a></li>
    <li><a href="/Link-3/">Link3</a></li> 
</ul>
</li>

我想要在此应用活动类，例如，如果用户在Link1页面上，父菜单应该突出显示。

我试过了

<li class="dropdown <?= ($activePage == 'Link-1 || Link-2 || Link-3') ? 'active':''; ?>">                 
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Services <span class="caret"></span></a>
 <ul class="dropdown-menu" role="menu">
        <li><a href="/Link-1/">Link-1</a></li>
        <li><a href="/Link-2/">Link-2</a></li>
        <li><a href="/Link-3/">Link-3</a></li> 
    </ul>
    </li> </li>

Answer 1

<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">
<?php
if($activePage == 'Link1'){
    echo "Link1";
}elseif($activePage == 'Link2'){
    echo "Link2";
}
?>
<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
    <li class="<?= ($activePage == 'Link1') ? 'active':''; ?>"><a href="/Link1/">Link1</a></li>
    <li class="<?= ($activePage == 'Link2') ? 'active':''; ?>"><a href="/Link2/">Link2</a></li>
    <li class="<?= ($activePage == 'Link3') ? 'active':''; ?>"><a href="/Link3/">Link3</a></li>
</ul>
</li>

javascript解决方案

<script>
 $(function(){
    $(".dropdown-menu").on('click', 'li a', function(){
      $(".dropdown-toggle").text($(this).text());
   });
});
</script>

您也可以使用javascript

<script>
 $(function(){
       $(".dropdown-toggle").text($(".dropdown-menu .active").text());
 });
</script>