如何实现动态导航栏-正在浏览的页面导航栏高亮？
菜单是用repeater,
<div id= "navigation ">
<ul>
<asp:Repeater ID= "Repeater1 " runat= "server ">
<ItemTemplate >
<li> <a href = ' <%#DataBinder.Eval(Container, "DataItem.Url ")%> '> <%#DataBinder.Eval(Container, "DataItem.ClassName ")%> </a> </li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
#navigation ul li a#active {
background: url(../images/navigation-active.gif);
color: #a21 !important;
font-weight: bold;
}
如果在li加上id区分active的连接，但是因为是repearter，他把所有的菜单都repeat成同一个id，结果导致全部菜单都是高亮了。我要怎么控制只有当前浏览页菜单才高亮啊~
[解决办法]
顶起，这个问题问得好，我也想知道。
不过用response.write来写肯定行。
[解决办法]
你可以试试在菜单数据绑定时判断链接的页面是否本页页面名称。 是则为其设定CS。
[解决办法]
睡了
你用CSS控制下
[解决办法]
我有个思路，可以把所有可能变亮的区域都作成panel然后使用document.panel.style控制样式
[解决办法]
<ul>
<asp:Repeater ID= "Repeater1 " runat= "server " OnDataBinding= "Repeater1_DataBinding ">
<ItemTemplate>
<li>
<asp:Panel ID= "panIndex " runat= "server ">
<a href= ' <%# DataBinder.Eval(Container, "DataItem.Url ") %> '>
<% #DataBinder.Eval(Container, "DataItem.ClassName ") %>
</a>
</asp:Panel>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
protected void Repeater1_DataBinding(object sender, EventArgs e)
{
Panel myPan = (Panel)Repeater1.Items[(int)你想要高亮的行的索引].FindControl( "panIndex ");
myPan.CssClass = "active ";
}
然后active中扩展 <div> 中 <a> 的样式
[解决办法]
这样应该也可以:
<asp:Repeater ID= "Repeater1 " runat= "server " OnPreRender= "Repeater1_PreRender ">
<ItemTemplate>
<asp:Literal ID= "Literal1 " runat= "server " Text= ' <%# formUrl(Eval( "Url "),Eval( "ClassName ")) %> '> </asp:Literal>
</ItemTemplate>
</asp:Repeater>
public string formUrl(object Url, object ClassName)
{
string curPageName = HttpContext.Current.Request.Url.Segments[HttpContext.Current.Request.Url.Segments.Length - 1];
if (Url.ToString().ToLower() == curPageName.ToLower())
{
return " <li> <a href=\ " " + Url.ToString() + "\ "> <font color=\ "red\ "> " + ClassName.ToString() + " </font> </a> ";
}
else
{
return " <li> <a href=\ " " + Url.ToString() + "\ "> " + ClassName.ToString() + " </a> ";
}
}
[解决办法]
Repeater 方式来做 较麻烦 没有尝试过 不过应该是有方法的
我想如果一定要这样做 你试试
在
<li id= "唯一 ">
或
<a id= "唯一 " href = ' <%#DataBinder.Eval(Container, "DataItem.Url ")%> '> <%#DataBinder.Eval(Container, "DataItem.ClassName ")%> </a>
生成一个唯一的标识 根据标识用css控制是否高亮
如果你是直接在页面中这样绑定的话比较难做到 生成唯一标识 建议：写一个cs类在类中指定
<ItemTemplate >
<li> <a href = ' <%#DataBinder.Eval(Container, "DataItem.Url ")%> '> <%#DataBinder.Eval(Container, "DataItem.ClassName ")%> </a> </li>
</ItemTemplate>
这段代码 这样就可以生成一个唯一的标识了
