Question

我正在创建asp.net web应用程序项目。在那里我创建了一个有页眉和页脚的母版页。在页面部分有一些链接..如果我点击链接那些链接转到他们自己的aspx文件..所有aspx文件都是使用母版页创建的...如何在不影响母版页内容的情况下突出显示每个链接。

这是我的代码:(我把星号放在了直线上）

<!-- header start -->

<li><a href="Default.aspx" class="Active">Home</a></li> *
          <li><a href="what.aspx">What We Do</a></li> *
          <li><a href="activities.aspx">Our Activities</a></li> *
          <li><a href="projects.aspx">Our Projects</a></li> * 
          <li><a href="contact.aspx">Contact</a></li> *

<!-- header start -->

Answer 1

您有页面的示例：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尝试自己的代码。希望这个帮助

Answer 2

Idea1：在特定页面上添加样式，并引用href链接。例如，在what.aspx中，您需要像下面一样添加它。

<style>
  li.a[href='what.aspx']{background-color:red; color:#fff;}
</style>

Idea2：为每个li添加课程。

 <li class="default"><a href="Default.aspx">Home</a></li>
 <li class="what"><a href="what.aspx">What We Do</a></li>
 <li class="activity"><a href="activities.aspx">Our Activities</a></li>
 <li class="projects"><a href="projects.aspx">Our Projects</a></li>
 <li class="Contact"><a href="contact.aspx">Contact</a></li>

在该特定页面上应用类的样式。对于what.aspx中的例子，你需要像下面一样添加它。

<style>
  li.what{background-color:red; color:#fff;}
</style>

Answer 3

你可以用一些jQuery

来做

将ID“li-home”添加到您的主页链接列表项，并为列表指定“菜单”ID

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

然后使用jQuery

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");
        }
    });
}

我创建了一个有头的主页。在标题部分有一些链接..我想突出显示链接而不影响母版页

3 个答案: