C# 我创建了一个有页眉的母版页。在页眉部分有一些链接。我想在不影响母版页的情况下突出显示这些链接

C# 我创建了一个有页眉的母版页。在页眉部分有一些链接。我想在不影响母版页的情况下突出显示这些链接,c#,javascript,css,asp.net,web-applications,C#,Javascript,Css,Asp.net,Web Applications,我正在创建asp.net web应用程序项目。在该项目中,我创建了一个具有页眉和页脚的母版页。在页眉部分有一些链接。如果我单击链接,链接将指向它们自己的aspx文件。所有aspx文件都是使用母版页创建的。如何在转到该页时突出显示每个链接而不影响母版页的内容 这是我的代码:(我放星星的那一行是链接) * * * * * 例如,您有页面:Home.aspx、WhatWeDo.aspx。。 你的菜单li0:Home.aspx,li1:WhatWeDo.aspx。。 您可以在母版页中使用全局javas

我正在创建asp.net web应用程序项目。在该项目中,我创建了一个具有页眉和页脚的母版页。在页眉部分有一些链接。如果我单击链接,链接将指向它们自己的aspx文件。所有aspx文件都是使用母版页创建的。如何在转到该页时突出显示每个链接而不影响母版页的内容

这是我的代码:(我放星星的那一行是链接)


  • *
  • *
  • *
  • *
  • *
    例如,您有页面:Home.aspx、WhatWeDo.aspx。。 你的菜单li0:Home.aspx,li1:WhatWeDo.aspx。。 您可以在母版页中使用全局javascript

    if(location.href.indexOf(“Home.aspx”)>0)setactivecss(0)
    else if(location.href.indexOf(“WhatWeDo.aspx”)>0)setactivecss(1)

    为选定页面设置活动css的步骤 您可以使用我的sugest尝试自己的代码。
    希望此帮助Idea1:在特定页面上添加样式,并参考href链接。例如,在
    what.aspx
    中,您需要像下面那样添加它

    <style>
      li.a[href='what.aspx']{background-color:red; color:#fff;}
    </style>
    
    为该特定页面上的类应用样式。对于what.aspx中的exmaple,您需要像下面那样添加它

    <style>
      li.what{background-color:red; color:#fff;}
    </style>
    
    
    什么{背景色:红色;颜色:#fff;}
    
    您可以通过一些jQuery来实现

    将id“li home”添加到您的主页链接列表项中,并为列表指定一个id“menu”

    <ul id='menu'>
      <li id="li-home"><a href="Default.aspx" class="Active">Home</a></li>
    

    例如,将css类设置为“活动”类,如下所示:
    .active a{background:#colorcode;
    并将其添加到您实际访问的.aspx页面的
    li
    元素.li.a[href='what.aspx']{背景色:红色;颜色:#fff;}??我必须在哪里复制此内容?在每个页面的ContentPlaceholder 1中?在每个aspx页面中都是。但是您需要根据原始页面更改样式中的页面名称。我不想要此内容…在我的项目中,我调用了css。已选择..如何添加到此内容???我不是asp.net开发人员
    <style>
      li.what{background-color:red; color:#fff;}
    </style>
    
    <ul id='menu'>
      <li id="li-home"><a href="Default.aspx" class="Active">Home</a></li>
    
    var path = window.location.pathname;
    
    if (path.trim() == "/") {
        //covers the case of the default page since default.aspx will not show
        $("#li-home").addClass("Active");
    }
    else {
        var items = $("#menu li");
        items.each(function (index, li) {
             var menuitem = $(li);
             if (path.trim() !== "/" && path.indexOf(menuitem.find("a").attr("href")) > -1) {
                 $("#li-home").removeClass("Active");
                menuitem.addClass("Active");
            }
        });
    }