母版页里用Bootstrap做了导航菜单,当子页切换时如何修改母版页里导航的激活页?

中文命名法 2016-07-21 11:04:38
<div class="navbar">
<ul class="nav nav-tabs">
<li class="active"><a href="../operation/addrec.aspx">新增记录</a></li>
<li><a href="../operation/list.aspx">业务查询</a></li>
<li><a href="../operation/outside.aspx">外勤统计</a></li>
<li><a href="../operation/setup.aspx">维护管理</a></li>
<li><a href="../compliance/index.aspx">产品合规</a></li>
<li><a href="../compliance/datapre.aspx">产品合规(数据录入)</a></li>
<li><a href="../compliance/processing.aspx">格式化(后台)</a></li>
<li><a href="../attendance/index.aspx">考勤管理</a></li>
</ul>
</div>

当切换不同子页的时候,怎么让母版页中的<li class="active">一起切换?
...全文
674 8 打赏 收藏 举报
写回复
8 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
假设就是按照你的现有的设计,我给你两个设计方案: 首先要能够用 asp.net 独立指定对象,像你那种“一股脑地把一堆 html 字符串写成一个 Literal 控件”的方式不能区分要独立设置的对象。所以需要添加 runat="server" 来细分对象。
<div class="navbar">
    <ul class="nav nav-tabs">
        <li runat="server" id="新增"><a href="../operation/addrec.aspx">新增记录</a></li>
        <li runat="server" id="查询"><a href="../operation/list.aspx">业务查询</a></li>
        <li><a href="../operation/outside.aspx">外勤统计</a></li>
        <li><a href="../operation/setup.aspx">维护管理</a></li>
        <li><a href="../compliance/index.aspx">产品合规</a></li>
        <li><a href="../compliance/datapre.aspx">产品合规(数据录入)</a></li>
        <li><a href="../compliance/processing.aspx">格式化(后台)</a></li>
        <li><a href="../attendance/index.aspx">考勤管理</a></li>
    </ul>
</div>
1. 第一中方式最靠谱的方式,就是让母版页隐藏自己的内部架构,而仅仅暴露要暴露的控件。例如首先定义要暴露的接口定义
using System.Web.UI.HtmlControls;

public interface  IDemoMaster
{
    HtmlGenericControl Ctrl新增 { get; }
}
这里我仅仅暴露一个链接。更多的连接你自己定义。 然后你的母版页要实现对外公布的接口,例如
public partial class MasterPage : System.Web.UI.MasterPage, IDemoMaster
{
    public HtmlGenericControl Ctrl新增
    {
        get
        {
            this.EnsureChildControls();
            return this.新增;
        }
    }
这里就把自己的一个控件公布出去,让外界访问。而至于内部把这个控件放在那里,外界客户程序不用操心。 最后,你的子页面就可以这样访问
((IDemoMaster)this.Master).Ctrl新增.Attributes.Add("class", "active");
这个方案最安全,面向业务接口而设计。 2. 自也可以直接查找母版页的控件,例如
((HtmlGenericControl)this.Master.FindControl("查询")).Attributes.Add("class", "active");
这个方式是权宜之计。因为它没有能力隐藏母版页不断重构时的内部结构。要知道UI,本来就是千变万化的,应该具有随时重构的能力。而这种面向底层接口编程,想当然地以为控件就在母版页的最顶层(而不在某个NamingContainer 内部)的做法,如果你有经验就知道了,明显带着隐患工作。
  • 打赏
  • 举报
回复
这跟你用了什么没有关系,除非你的页面没有刷新,会保留当前的样式 和 当前的脚本效果 页面刷新了,你想要切换选中状态,你就得根据当前页面 去操作脚本 去设置当前菜单选中 比如 setTab('业务查询');
  • 打赏
  • 举报
回复
samsone 2016-07-21
引用 6 楼 sp1234 的回复:
嗯,面向 asp.net 技术编程,还是面向 web前端技术编程,这是一个确实需要分割的问题。有所为有所不为。 如果面向 asp.net 编程,就不要过度使用 javascript 方式,因为那会跟你的服务器端编程机制产生纠结。如果面向 前端web技术变成,那么你这个菜单在页面上设计一个<div>就好了,然后用 jQuery.get("./template/menu.html", function) 之类的方式动态加载 html,使用 jquery 动态设置
divObj("#abc").addClass("active")
用前端方式编程,对于独立的菜单,就纯粹一些,比较好维护。用 asp.net 方式编程,对于独立的菜单,也纯粹一些,比较好维护。混合起来编程,当你大量使用 asp.net 服务器端控件(包括母版页、用户控件),那就会迅速混乱。 实际上我们从高薪招聘asp.net 程序员变为“不”招聘 asp.net 程序员,这就是“好维护”的一个例证。我们不会找那些asp.net 也不精(无法维护大型 asp.net 程序),前端 web 框假也不精(一旦开发几千行typescript 代码的小系统就蒙)的程序员。 所以,其实抛开 asp.net,你还有一种选择,就是学好一种最方便开发大系统的精巧的前端框架。有些人听说某个框架听流行的,结果这个前段web框架极其繁琐,它花了2个月只通晓了其五分之一不到,连应聘都不敢。
深有感触.... 现在很多程序员都是这种现状,..asp.net 不了解 就去弄前端web框架 然后直接在前端web框架页面 又出现runat=server 搞得四不像...
  • 打赏
  • 举报
回复
divObj.find("#abc").addClass("active")
  • 打赏
  • 举报
回复
嗯,面向 asp.net 技术编程,还是面向 web前端技术编程,这是一个确实需要分割的问题。有所为有所不为。 如果面向 asp.net 编程,就不要过度使用 javascript 方式,因为那会跟你的服务器端编程机制产生纠结。如果面向 前端web技术变成,那么你这个菜单在页面上设计一个<div>就好了,然后用 jQuery.get("./template/menu.html", function) 之类的方式动态加载 html,使用 jquery 动态设置
divObj("#abc").addClass("active")
用前端方式编程,对于独立的菜单,就纯粹一些,比较好维护。用 asp.net 方式编程,对于独立的菜单,也纯粹一些,比较好维护。混合起来编程,当你大量使用 asp.net 服务器端控件(包括母版页、用户控件),那就会迅速混乱。 实际上我们从高薪招聘asp.net 程序员变为“不”招聘 asp.net 程序员,这就是“好维护”的一个例证。我们不会找那些asp.net 也不精(无法维护大型 asp.net 程序),前端 web 框假也不精(一旦开发几千行typescript 代码的小系统就蒙)的程序员。 所以,其实抛开 asp.net,你还有一种选择,就是学好一种最方便开发大系统的精巧的前端框架。有些人听说某个框架听流行的,结果这个前段web框架极其繁琐,它花了2个月只通晓了其五分之一不到,连应聘都不敢。
  • 打赏
  • 举报
回复
获取window.location.href,然后在 $(document).ready时each遍历菜单超级链接,看window.location.href是否包括这个超级链接值,有的就给激活,没的就取消
  • 打赏
  • 举报
回复
insus 2016-07-21
在2013年有写过一个实例,可以参考: http://www.cnblogs.com/insus/p/3207936.html 另外一篇是今年3月份写的,是与Bootstarp有关的: http://www.cnblogs.com/insus/p/5287093.html
  • 打赏
  • 举报
回复
关于你的问题,我再给你重复一下最基本的 asp.net 知识概念。不知道你在学习 asp.net 时有没有学到过。如果没有,那么真的有点坑爹,学费有点冤枉。 你贴的代码
<div class="navbar">
<ul class="nav nav-tabs">
<li class="active"><a href="../operation/addrec.aspx">新增记录</a></li>
<li><a href="../operation/list.aspx">业务查询</a></li>
<li><a href="../operation/outside.aspx">外勤统计</a></li>
<li><a href="../operation/setup.aspx">维护管理</a></li>
<li><a href="../compliance/index.aspx">产品合规</a></li>
<li><a href="../compliance/datapre.aspx">产品合规(数据录入)</a></li>
<li><a href="../compliance/processing.aspx">格式化(后台)</a></li>
<li><a href="../attendance/index.aspx">考勤管理</a></li>
</ul>
</div>
这整个被 asp.net 生成一个 Literal 控件,这个控件的 Text 属性就是返回了这一大堆 html 字符串。 也就是说,asp.net 使用一个最底层的控件,原样保存你写的 html 字符串。然后当页面 Render 阶段,递归调用所有控件的 ControlRender 方法,于是这个 Literal 控件就把这个 Text 文本内容原样输出到页面的 HtmlTextWriter 中,最终输出到客户端。 也就是说,这一大堆东西,对于 asp.net 程序本身来说其实跟任何垃圾html字符串都一样,就算是你胡写这些东西也是一样的,它根本不 care 一眼!你若知道这个机制,就不会纠结帖子的这类问题了。 你必须改变它,向上面那样使用 runat="server" ,把你写的这一大堆由一个 Literal 控件变为 Literal、HtmlGenericControl、HtmlGenericControl、Literal 四个控件,才能应用改变你要处理的细节控件。
  • 打赏
  • 举报
回复
发帖
.NET社区

6.0w+

社区成员

.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • R小R
  • 喵叔哟
加入社区
帖子事件
创建了帖子
2016-07-21 11:04
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。