javascript - 我正在使用 php includes 来构建一个多页面网站。使用 jquery，我如何将类 "active"添加到每个网页以便突出显示

Question

我正在使用 php include 来构建一个多页面网站。使用 jquery，我如何向每个网页添加一个“事件”类，菜单突出显示用户当前正在查看的任何网页。

这是我的导航 html:

<nav class="menu">
    <ul class="nav">
        <li><?php if ($thisPage=="Home") 
        echo " id=\"currentpage\""; ?><a href="http://urcsc170.org/pdouge/project3xc/index.php">Home</a></li>
        <li><?php if ($thisPage=="Jeff Bezos") 
        echo " id=\"currentpage\""; ?><a href="http://urcsc170.org/pdouge/project3xc/jeff-bezos.php">Jeff Bezos</a></li>
        <li><?php if ($thisPage=="Larry Page") 
        echo " id=\"currentpage\""; ?><a href="http://urcsc170.org/pdouge/project3xc/larry-page.php">Larry Page</a></li>
        <li><?php if ($thisPage=="Edward Snowden") 
        echo " id=\"currentpage\""; ?><a href="http://urcsc170.org/pdouge/project3xc/edward-snowden.php">Edward Snowden</a></li>
        <li><?php if ($thisPage=="Elon Musk") 
        echo " id=\"currentpage\""; ?><a href="http://urcsc170.org/pdouge/project3xc/elon-musk.php">Elon Musk</a></li>
    </ul>
</nav>

Answer 1

下面的 activeurl 获取当前 url ，如果它匹配你的事件类自动分配。

    /*active menu class*/  
 <ul class="menu">            
                <li><a  href="demo.com">home</a>
                </li>      
                <li><a href="xyz.com/category/test">Editorial</a></li>
</ul>
         $(document).ready(function(){
             var activeurl = window.location;
             $('a[href="' + activeurl + '"]').parent('li').addClass('active'); 
         });