如何使用jquery或javascript

时间:2016-08-17 10:44:32

标签: jquery html css asp.net master-pages

如何激活当前菜单

即。如果我选择并转到该页面,则下拉菜单需要在asp .net c#中动态激活(<li class="active treeview">)。

我想在c#中使用jquery或javascript。

所有左侧下拉列表都可以在母版页中找到。

      <li class="treeview" id="settingId" runat="server">
                            <a href="#">
                                <i class="fa fa-files-o"></i>
                                <span>SETTING</span>

                            </a>
                            <ul class="treeview-menu">
                                <li><a href=""><i class="fa fa-circle-o"></i>CATEGORY MANAGEMENT</a></li>
                                <li><a href=""><i class="fa fa-circle-o"></i>ADD CATEGORY</a></li>
                                <li><a href=""><i class="fa fa-circle-o"></i>EMAIL MANAGEMENT</a></li>
                                <li><a href=""><i class="fa fa-circle-o"></i>CHANGE PASSWORD</a></li>
                            </ul>
                        </li>
 <li class="treeview" id="portfolioId" runat="server">
                        <a href="#">
                            <i class="fa fa-pie-chart"></i>
                            <span>PORTFOLIO</span>
                            <i class="fa fa-angle-left pull-right"></i>
                        </a>
                        <ul class="treeview-menu">
                            <li><a href=""><i class="fa fa-circle-o"></i>PROJECT MANAGEMENT</a></li>
                            <li><a href=""><i class="fa fa-circle-o"></i>ADD PROJECT</a></li>
                            <li><a href=""><i class="fa fa-circle-o"></i>PRODUCT MANAGEMENT</a></li>
                            <li><a href=""><i class="fa fa-circle-o"></i>ADD PRODUCT</a></li>
                        </ul>
                    </li>

2 个答案:

答案 0 :(得分:1)

您可以在主页面中放置一个隐藏字段,其中包含当前标签的ID(父li)。然后在内容页面中设置该隐藏字段的值。

使用隐藏字段的值来确定要突出显示的选项卡。此代码假定父ulid="MasterMenu",而runat="server"。此外,隐藏字段还有id="CurrentTab"

function highlightTab() {
    var currentTab;

    //Get the id of the current tab from the hidden field
    currentTab = $('#CurrentTab').val();

    if (currentTab !== null) {
        //Remove the active-treeview class from all top level li elements
        $('#MasterMenu').children('li').removeClass('active-treeview');

        //Set the active-treeview class to the current tab
        $('#' + currentTab).addClass('active-treeview');
    }
}

修改
以下是您将放在母版页上的隐藏字段的示例。我通过添加runat="server"属性将其提供给后面的代码。当控件具有runat="server"时,.NET将在呈现页面时重命名该ID。要停止此行为,以便您可以轻松访问JavaScript中的隐藏字段,请添加ClientIDMode="static"属性。

<asp:HiddenField id="CurrentTab" value="" runat="server" ClientIDMode="static" />

在内容页面的页面加载事件中,将该隐藏字段的值设置为要为该页面突出显示的选项卡的ID。

HiddenField currentTab;
currentTab = (HiddenField)this.Master.FindControl("CurrentTab");
currentTab.Value = "settingId";

答案 1 :(得分:-1)

在每个页面中需要更改当前ID(假设为leftsidebar_settingId

  <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                debugger;
                //$('#leftsidebar_portfolioId').addClass('treeview');
                $('#leftsidebar_settingId').addClass('treeview active');
            });

        </script>