php - AddClass ('selected' ) 在共享标题的菜单上

Question

我在 header.php 中创建了一个菜单，它将包含在每个文件中，例如 index.php 或 contact-us.php。

我现在唯一的问题是将selected 添加到菜单中选定的主要类别。 以下代码基本上可以工作，直到加载选定的页面，之后，删除选定的属性。

你能帮我解决这个问题吗？

HTML

<nav id="navigation">
<ul id="navtop">
    <li class=" first has_navchild" id="Home">
        <a href="index.php">Home</a>
        <ul class="submenu">
            <li class=" first has_navchild">
                <a href="index.php">Home</a>
            </li>
            <li class=" last">
                <a href="who-we-are.php">Who we are</a>
            </li>   
        </ul>
    </li>
    <li class=" has_navchild" id="Contacts">
        <a href="contacts.php">Contacts</a>
        <ul class="submenu">
            <li class=" first has_navchild">
                <a href="where.php">Where we are</a>
            </li>
            <li class=" last">
                <a href="form.php">Contact form</a>
            </li>
        </ul>
    </li>
</ul>

jQuery

$(document).ready(function () {
    $('#navigation ul li').click(function(event){
        event.preventDefault();
        if(($(this).attr("id") === "Home"))
        {
            alert($(this).attr('id')); 
            $("#navigation ul li#Contacts").removeClass("selected");
            $("#navigation ul li#Home").addClass("selected");
        }
        else if($(this).attr("id") === "Contacts")
        {
            alert($(this).attr('id')); 
            $("#navigation ul li#Home").removeClass("selected");
            $("#navigation ul li#Contacts").addClass("selected");
        }
    });    
});

谢谢你的帮助

Answer 1

我用这个方法:

$(window).load(function() {
                  var url = window.location;
                    $('#navtop a').filter(function() {
                        return this.href == url;
                    }).parents("li").addClass('selected');

            });

它检查当前加载的页面并自动添加 'selected'类到其父类 <li>