改变& lt; li>类在加载页面时激活

本文关键字：加载 激活 lt li 改变 | 更新日期: 2023-09-27 18:05:50

当页面加载时，我很难使<li>类激活。这是我的场景，我复制了一个样本下拉框在某个网站，以整合它在我的网站。我使用c# Asp。净

_Layout.cshtml 

<body>
<div id="header">
    @Html.Partial("_HeaderPartial")
</div>
<!--SIDEBAR Navigation-->
<aside id="menu">
// The Dropdown       
        @Html.Partial("_SidebarPartial")
</aside>
<div id="wrapper">
        @RenderBody()
    <footer class="footer">
        @Html.Partial("_FooterPartial")
    </footer>
</div>
<div id="right-sidebar" class="animated fadeInRight">
    @Html.Partial("_RightSidebarPartial")
</div>
</body>

_SidebarPartial 

 <ul class="nav" id="side-menu">
    <li>
        <a href="@Url.Action("Index", "Home")"> <span class="nav-label">Dashboard</span> </a>
    </li>
    <li>
        <a href="@Url.Action("Analytics", "Home")"> <span class="nav-label">Analytics</span></a>
    </li>
    <li>
        <a href="#"><span class="nav-label">Interface</span><span class="fa arrow"></span> </a>
        <ul class="nav nav-second-level">
            <li><a href="@Url.Action("PanelDesign", "Home")">Panels design</a></li>
            <li><a href="@Url.Action("Typography", "Home")">Typography</a></li>
            <li><a href="@Url.Action("Buttons", "Interface")">Colors &amp; Buttons</a></li>
            <li><a href="@Url.Action("Components", "Interface")">Components</a></li>
            <li><a href="@Url.Action("Alerts", "Interface")">Alerts</a></li>
            <li><a href="@Url.Action("Modals", "Interface")">Modals</a></li>
        </ul>
    </li>
    <li>
        <a href="#"><span class="nav-label">App views</span><span class="fa arrow"></span> </a>
        <ul class="nav nav-second-level">
            <li><a href="@Url.Action("Contacts", "AppViews")">Contacts</a></li>
            <li><a href="@Url.Action("Projects", "AppViews")">Projects</a></li>
            <li><a href="@Url.Action("ProjectDetail", "AppViews")">Project detail</a></li>
            <li><a href="@Url.Action("AppPlans", "AppViews")">App plans</a></li>
            <li><a href="@Url.Action("SocialBoard", "AppViews")">Social board</a></li>
        </ul>
    </li>
    <li>
        <a href="#"><span class="nav-label">Charts</span><span class="fa arrow"></span> </a>
        <ul class="nav nav-second-level">
            <li><a href="@Url.Action("", "")">ChartJs</a></li>
            <li><a href="@Url.Action("", "")">Flot charts</a></li>
            <li><a href="@Url.Action("", "")">Inline graphs</a></li>
        </ul>
    </li>
    <li>
        <a href="#"><span class="nav-label">Box transitions</span><span class="fa arrow"></span> </a>
        <ul class="nav nav-second-level">
            <li><a href="@Url.Action("", "")"><span class="label label-success pull-right">Start</span> Overview </a>  </li>
            <li><a href="@Url.Action("", "")">Columns from up</a></li>
        </ul>
    </li>
   </ul>

改变& lt; li>类在加载页面时激活

正如我所评论的，这里有一个列表中id属性的小示例:

<ul class="nav" id="side-menu">
    <li id="interfaces">
        <a href="#"><span class="nav-label">Interface</span><span class="fa arrow"></span> </a>
        <ul class="nav nav-second-level">
            <li><a href="@Url.Action("PanelDesign", "Home")">Panels design</a></li>
            <li><a href="@Url.Action("Typography", "Home")">Typography</a></li>
            <li><a href="@Url.Action("Buttons", "Interface")">Colors &amp; Buttons</a></li>
            <li><a href="@Url.Action("Components", "Interface")">Components</a></li>
            <li><a href="@Url.Action("Alerts", "Interface")">Alerts</a></li>
            <li><a href="@Url.Action("Modals", "Interface")">Modals</a></li>
        </ul>
    </li>
</ul>

然后可以在document.ready函数中添加以下行:

$("#interfaces").attr("class", "active");

看看这个。这也会帮助你

只需在document中编写以下代码。准备好函数

$('#interfaces').addClass('active');

欢呼

相关文章：