点击按钮后跳转新页面,主页面的焦点位置如何变换?

7年 2014-09-22 04:01:54
主页面是这样的:

<div class="collapse navbar-collapse" id="navbar">
<ul class="nav navbar-nav">
<li class="active"><a target="mainFrame" href="Module/CurrentLocation.aspx">当前位置</a></li>
<li class="purple"><a target="mainFrame" href="Module/TrackPlaybacks/index.aspx">轨迹回放</a></li>
<li><a target="mainFrame" href="Module/ElectronicFence.aspx">电子围栏</a></li>
<li><a target="mainFrame" href="Module/TCommandLogList.aspx">指令日志</a></li>
<li ><a target="mainFrame" href="Module/TimingPositioningList.aspx" >定时定位</a></li>
<li><a target="mainFrame" href="Module/DeviceSet.aspx">设备设置</a></li>
</ul>
</div>

li中的class为active的是主页面获得焦点的标签,点击不同的标签会切换焦点。JS如下:

$("nav, ul.nav").each(function () {
var nav = $(this);
nav.find("a").click(function () {
nav.find(".active").removeClass("active");
$(this).parent("li").addClass("active");
});
});


现在我在一个页面放置一个按钮,使用window.location.href='' 跳转页面,怎么能让标签的焦点切换?

...全文
295 19 打赏 收藏 转发到动态 举报
写回复
用AI写文章
19 条回复
切换为时间正序
请发表友善的回复…
发表回复
7年 2014-09-23
  • 打赏
  • 举报
回复
非常感谢functionsub!
functionsub 2014-09-22
  • 打赏
  • 举报
回复
引用 17 楼 zzflover 的回复:
按钮在CurrentLocation.aspx页中
哦。按钮直接做跳转就可以了,不用加其他内容了。 9L的代码会在每次mainFrame加成完成后,去top(主页面)获取navbar,然后去遍历每个a标签的连接地址,跟当前mainFrame的pathname做对比,如果发现这个A标签地址包含了pathname,那就给这个a标签的父节点li加上active样式。 当然,里面的判断条件你自己可以改的。我那写的是pathname可能不太准确,具体的判断就不用我来说了吧? 从location里面可以获取到足够的信息跟a标签的地址进行对比了。
7年 2014-09-22
  • 打赏
  • 举报
回复
按钮在CurrentLocation.aspx页中
functionsub 2014-09-22
  • 打赏
  • 举报
回复
把9L的代码放到那些个a标签页面中公用的JS里面去。 当然,这些都建立在不跨域的情况下。 (跨子域也可以,不过要设置domain。) 另外,。没有看到你说的按钮啊。
7年 2014-09-22
  • 打赏
  • 举报
回复

<body style="padding-top: 50px; overflow: hidden;">
    <form id="form1" runat="server">
    <!-- 菜单 -->
    <div id="sidebar">
        <nav id="nav" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
	    <div class="container-fluid" >
		    <div class="navbar-header">
		        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">
			        <span class="sr-only">Toggle navigation</span>
			        <span class="icon-bar"></span>
			        <span class="icon-bar"></span>
			        <span class="icon-bar"></span>
		        </button>
		        <a class="navbar-brand" href="#">CNCLBS</a>
		    </div>

		    <div class="collapse navbar-collapse" id="navbar">
		        <ul class="nav navbar-nav">
			        <li class="active"><a target="mainFrame" href="Module/CurrentLocation.aspx">当前位置</a></li>
			        <li class="purple"><a target="mainFrame" href="Module/TrackPlaybacks/index.aspx">轨迹回放</a></li>
			        <li><a target="mainFrame" href="Module/ElectronicFence.aspx">电子围栏</a></li>
                   <li><a target="mainFrame" href="Module/TCommandLogList.aspx">指令日志</a></li>  
                   <li ><a target="mainFrame" href="Module/TimingPositioningList.aspx" >定时定位</a></li>
                   <li><a target="mainFrame" href="Module/DeviceSet.aspx">设备设置</a></li>
                   <%-- <li class="dropdown">
			            <a href="#" class="dropdown-toggle" data-toggle="dropdown">其它设置<span class="caret"></span></a>
			            <ul class="dropdown-menu" role="menu">
                          
                             
			                <li><a target="mainFrame" href="Module/OOBRemind.aspx">越界提醒</a></li>
			                <li><a target="mainFrame" href="Module/RemoteControl.aspx">远程控制</a></li>
                            <li><a target="mainFrame" href="Module/WarningRangeSetList.aspx">报警范围设置</a></li>
                            <li><a target="mainFrame" href="Module/AreaWarningSetList.aspx">区域报警设定</a></li>
			            </ul>
			        </li>   --%>
		        </ul>
		        <ul class="nav navbar-nav navbar-right"> 
			        <li class="dropdown">
                        <% CNCLBS.Model.LoginInfo info = (CNCLBS.Model.LoginInfo)Session["LoginInfo"]; %> 
			            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <%if (info.deviceModel == null || string.IsNullOrEmpty(info.deviceModel.FDeviceName))
                          {%>
                          无设备
                         <% }
                          else
                          {%>
                             <%=info.deviceModel.FDeviceName %> 
                         <% } %>
                        
                        <span class="caret"></span></a>
			            <ul class="dropdown-menu" role="menu">
                       
				            <li><a target="mainFrame" href="Module/DeviceRegister.aspx" onclick="" >注册新设备</a></li>
                             <li class="divider"></li>
				            <%--<li><a target="mainFrame" href="Module/.aspx">设备1</a></li>
				            <li><a target="mainFrame" href="Module/.aspx">设备2</a></li>
				            <li><a target="mainFrame" href="Module/.aspx">设备3</a></li>--%>
                            <%
                                foreach (var model in info.deviceList)
                                {
                            %>
                                  <li><a href="javascript:top.location.href='<%=CNCLBS.Utils.Utils.GetUrlMsg() %>main.aspx?device_id=<% =model.FDeviceNo %>'"><%=model.FDeviceName%></a></li>
                            <%} %>
                            


                            <%--<asp:DropDownList ID="ddlDevice" runat="server"></asp:DropDownList>--%>

                            <%-- 设备列表 --%>

				            
			            </ul>
			        </li>
                    <li class="dropdown">
			            <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <%=info.User.FName %> <span class="caret"></span></a>
			            <ul class="dropdown-menu" role="menu">
				
				       
			            </ul>
			        </li>
		        </ul>
		    </div><!-- /.navbar-collapse -->
	    </div><!-- /.container-fluid -->
	</nav>
    </div>
    <div class="container-fluid">
        <iframe id="mainFrame" name="mainFrame" fillh="25" style="width: 100%; border: 0;
            margin: 0; padding: 0; overflow: auto;" src="Module/CurrentLocation.aspx"></iframe>
    </div>
    <div class="navbar-fixed-bottom text-center" style="height: 25px; padding: 3px; margin: 0px;
        background-color: #777">
        <a href="http://www.cncsys.com.cn" target="_blank" style="color: white"></a>
          <span style="color: white; font-size: 12px" id="txtVer" runat="server" />
    </div>
    </form>
</body>
</html>

functionsub 2014-09-22
  • 打赏
  • 举报
回复
你还是把你的html发一下吧。 nav在哪 mainframe在哪 按钮又在哪
7年 2014-09-22
  • 打赏
  • 举报
回复
有点懵了,您给我写的这段JS应该放在main里,还是我的有跳转按钮的页面里?
functionsub 2014-09-22
  • 打赏
  • 举报
回复
。。。你把你整个HTML贴出来一下吧。 莫非div在main里面,a标签又指向到mainIframe里面
7年 2014-09-22
  • 打赏
  • 举报
回复
div那段是在主页面上的,就是main页
functionsub 2014-09-22
  • 打赏
  • 举报
回复
要在iframe中遍历top页面中的a标签,所以要加上top。。。
functionsub 2014-09-22
  • 打赏
  • 举报
回复
$(function(){
var pathname = location.pathname;//找到这个页面的路径
top.$('.navbar-nav a').each(function(){、/加上top遍历主页面navbar中的所有a标签
    var href = top.$(this).attr('href');//获取连接地址
    if(href.indexOf(pathname) !=-1){//看看是不是包含当前页的路径
        top.$('.navbar-nav li').removeClass('active');//有的话首先把active全部去掉
        top.$(this).parent().addClass('active');//再给这个加上active
    }
})
});
functionsub 2014-09-22
  • 打赏
  • 举报
回复
我想了一下,。你这段HTML是放在主页面的吧?
7年 2014-09-22
  • 打赏
  • 举报
回复
引用 6 楼 functionsub 的回复:
突然发现,你还是把3楼的代码放到所有页面公用的JS里面去吧。。这样省事。。 要放在主页面,要改的就多了。。。 又二了。。哎。。
我在1L写的JS就是在公共的JS里的,替换以后还是不行。不知道为啥了
functionsub 2014-09-22
  • 打赏
  • 举报
回复
突然发现,你还是把3楼的代码放到所有页面公用的JS里面去吧。。这样省事。。 要放在主页面,要改的就多了。。。 又二了。。哎。。
functionsub 2014-09-22
  • 打赏
  • 举报
回复
如果不想加在IFRMAE里面,那就把
var pathname = location.pathname;
改成
var pathname = $('iframe[name=mainFrame]').attr('src');
这样放在主页面就可以了,上面那个不用考虑了。太二了。
functionsub 2014-09-22
  • 打赏
  • 举报
回复
目测你是加了iframe了。这个代码要放到iframe里面去。
7年 2014-09-22
  • 打赏
  • 举报
回复
回楼上,没好用呢。。。
functionsub 2014-09-22
  • 打赏
  • 举报
回复
$(function(){
var pathname = location.pathname;//找到这个页面的路径
$('.navbar-nav a').each(function(){//遍历所有a标签
    var href = $(this).attr('href');//获取连接地址
    if(href.indexOf(pathname) !=-1){//看看是不是包含当前页的路径
        $('.navbar-nav li').removeClass('active');//有的话首先把active全部去掉
        $(this).parent().addClass('active');//再给这个加上active
    }
})
});

简单的说就是根据当前页面的URL来判断到底该选择哪个。。当然,条件你可以自己再重写。
7年 2014-09-22
  • 打赏
  • 举报
回复
难道又要0回复?还是我的问题太奇葩?

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧