jq实现点击导航栏中的任意一个跳转后被点击的定位到第一个

实现类似于这种效果:

思路:

1、通过获取点击部分的index然后作为参数加在a标签的url最后。

2、在跳转后的页面通过判断参数,来实现点击部分由原来的位置变换到首位。

代码:

html代码:

<div class="div1">
  <ul class="nav" id="nav">
	<li class="active"><a href="index1.html">首页</a></li>
	<li><a href="index2.html">对象</a></li>
	<li><a href="index3.html">场合</a></li>
  </ul>
</div>

js代码:

window.οnlοad=function(){
				 //获取url中的参数
		         function getUrlParam(name) {
				      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
				      var r = window.location.search.substr(1).match(reg); //匹配目标参数
				      if (r != null) return unescape(r[2]); return null; //返回参数值
				    }
		        var index=getUrlParam("id");
		          $("#nav li:eq(0)").removeClass("active");
			    $("#nav li:eq("+index+")").prependTo($("#nav"));  
		//	    $("#nav li:eq(2)").remove();  
			 $("#nav li:eq(0)").addClass("active");
			    $("#nav li:eq(0)").siblings().removeClass("active");
	    	}
			$("#nav li").click(
				function(){
					//alert($(this).children("a").attr("href")+"?id="+$(this).index());  //在点击的a标签的url后面加参
					 window.open($(this).children("a").attr("href")+"?id="+$(this).index());
				});

  

 

 

转载于:https://www.cnblogs.com/formybestlife/p/6994233.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值