Jquery 是否将导航栏设置为活动？_Jquery_Css_Hyperlink_Navbar

Jquery 是否将导航栏设置为活动？

jquery css hyperlink

Jquery 是否将导航栏设置为活动？,jquery,css,hyperlink,navbar,Jquery,Css,Hyperlink,Navbar,如何将导航栏更改为活动？它不适用于：活动！我用jQuery尝试了很多方法，但都没有成功。有人能帮我吗。我没有更多的想法这是我使用的CSS： #head-balken{ width:auto; height:5px; background-color:#00C; margin-left:110px; } #header { list-style-type: none; background-color: #666;

如何将导航栏更改为活动？它不适用于：活动！我用jQuery尝试了很多方法，但都没有成功。有人能帮我吗。我没有更多的想法

这是我使用的CSS：

    #head-balken{
    width:auto;
    height:5px;
    background-color:#00C;
    margin-left:110px;  
}

    #header {

    list-style-type: none;
    background-color: #666;
    line-height: 52px;
    height: 52px;
    margin-left:110px;

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .menu {
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    margin-right: 10px;
    font-size:18px;
    color:#FFF;
    text-decoration:none;
    font-family: 'Gudea', sans-serif;
}


    .menu:hover{

    position:relative;
    height:55px;
    top:-3px;
    background-color: #00C;

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;

}

    .menu.active{

    position:relative;
    height:55px;
    top:-3px;
    background-color: black;

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;

}

这是我的HTML代码：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="css/head.css" type="text/css" />
<script src="js/jquery.js" type="text/javascript"></script>
<link href='http://fonts.googleapis.com/css?family=Gudea' rel='stylesheet' type='text/css'>

<script>

</script>

<title>HBH-Interne</title>

</head>

<body>
    <div id="head-picture">
        <img src="image/hbhlogo.jpg" width="110px" height="57px" />
    </div>    


    <div id="header">
        <ul id="nav"> 
            <a href="home.php?seite=interne"><li class="menu">Interne Funktionen</li></a>
            <a href="home.php?seite=doku"><li class="menu" >Dokumentation</li></a>
            <a href="home.php?seite=desktop "><li class="menu" >Desktop Sitzungen</li></a>
            <a href="home.php?seite=admin"><li class="menu" >Administration</li></a>

            <a href="#"><li class="login" >Login</li></a>
        </ul>
    </div>
    <div id="head-balken"></div>        

</body>
</html>


HBH实习生

查看CSS，您必须将类“active”添加到li中

因此：

互联网功能用户jQuery toggleClass（）

你自己试一试，如果有任何问题，请发回。

我已经解决了

这是我的解决方案：

    var page = document.location.href;

    // Get current URL
    var href = window.location.href;

    // Remove trailing slash
    href = href.substr(-1) == '/' ? href.substr(0, href.length - 1) : href;

    // Get last part of current URL
    page = href.substr(href.lastIndexOf('=') + 1);
    console.log(page);


    if(page == 'interne'){
      $('#interne').addClass('active');
    }
    else{
      $('#interne').removeClass('active');
    }

“更改为活动”的确切含义是什么？修复您的ul li HTML。在libut中放置一个标记，如果我这样做，这个标记将在每次突出显示，而不仅仅是在它处于活动状态时。那么，你必须告诉它何时处于活动状态。例如，您可以查看当前URL，然后切换类以获得正确的项（正如JHuangweb建议的那样）。假设您有100个菜单项，您将在if-else条件下写入所有菜单项？

    var page = document.location.href;

    // Get current URL
    var href = window.location.href;

    // Remove trailing slash
    href = href.substr(-1) == '/' ? href.substr(0, href.length - 1) : href;

    // Get last part of current URL
    page = href.substr(href.lastIndexOf('=') + 1);
    console.log(page);


    if(page == 'interne'){
      $('#interne').addClass('active');
    }
    else{
      $('#interne').removeClass('active');
    }