用锚链接解决PHP跳转问题

最近在用PHP改我写的前端页面，毕竟是刚接触PHP，还好有文档，我们直接来说问题吧，现在有这样一个需求，在首页点击我的二级导航栏，需要跳转到相对应的另一个页面，还需要一一对应所跳转的页面被选中，自己当时就想用Ajax来进行操作，但是部门主管不让用，说把每个页面拆分出来，我当时听完人都傻了，然后请教了一下大神给想了一种办法，但是这种办法也有缺陷，废话说太多了，直接上代码看看

<!-- 关于我们模块 -->
<!-- 这是我们需要跳转的页面，给他们都取一个ID -->
					<ul class="center_lf_sub1_ul1">
						<div class="center_lf_sub1_text">关于我们</div>
						<li class="center_lf_sub1_li1 active" id="center_rg1">企业概况</li>
						<div class="center_lf_sub1_long"></div>
						<li class="center_lf_sub1_li2" id="center_rg2">企业资质</li>
						<div class="center_lf_sub1_long"></div>
						<li class="center_lf_sub1_li3" id="center_rg3">企业文化</li>
						<div class="center_lf_sub1_long"></div>
						<li class="center_lf_sub1_li4" id="center_rg4">市场网络</li>
						<div class="center_lf_sub1_long"></div>
						<li class="center_lf_sub1_li5" id="center_rg5" >服务模式</li>
						<div class="center_lf_sub1_long"></div>
					</ul>
<!-- 这是我们首页的导航部分，给对应需要点击跳转的饿添加(#   +   之前取的ID) -->
					<div class="women_rg clear">
						<ul class="women_rg_ul">
							<li class="women_rg_li1" data-ele="center_rg1">
								<p class="women_rg_ul_p">
								<a href="http://localhost/article.php?name=about#center_rg1">企业概况</a></p>
								<div class="women_rg_ul_long"></div>
							</li>
							<li class="women_rg_li1" data-ele="center_rg2">
								<p class="women_rg_ul_p"><a href="http://localhost/article.php?name=about#center_rg2">企业资质</a></p>
								<div class="women_rg_ul_long"></div>
							</li>
						</ul>
						<ul class="women_rg_ul">
							<li class="women_rg_li1" data-ele="center_rg3">
								<p class="women_rg_ul_p"><a href="http://localhost/article.php?name=about#center_rg3">企业文化</a></p>
								<div class="women_rg_ul_long"></div>
							</li>
						</ul>
						<ul class="women_rg_ul">
							<li class="women_rg_li1" data-ele="center_rg4">
								<p class="women_rg_ul_p"><a href="http://localhost/article.php?name=about#center_rg4">市场网络</a></p>
								<div class="women_rg_ul_long"></div>
							</li>
							<li class="women_rg_li1" data-ele="center_rg5">
								<p class="women_rg_ul_p"><a href="http://localhost/article.php?name=about#center_rg5">服务模式</a></p>
								<div class="women_rg_ul_long"></div>
							</li>
						</ul>
					</div>		
	<!-- 这样就可以了么，那是不可能的，还有JS -->	
	$('women_rg_ul_p').click(function() {
    var i = $(this).index(); //下标第一种写法
    //var i = $('tit').index(this);//下标第二种写法
    $(this).addClass('select').siblings().removeClass('select');
    $('#con li').eq(i).show().siblings().hide();
});
$(".women_rg_ul_p").click(function() {
    var i = $(this).index(); //下标第一种写法
    //var i = $('tit').index(this);//下标第二种写法
    $(this).addClass('select').siblings().removeClass('select');
    $('center_lf_sub1_ul1 li').eq(i).show().siblings().hide();
});				

这些代码写了这么多，其实也就是用了锚链接的方式，之前没有太重视这个锚链接。
现在来说说这个的缺点在哪，虽然现在已经实现了我想要的跳转效果，但是当他跳转的时候，会跳转到对应的锚上面，也就是说跳转的页面不是你的头部在最顶上面，而是你对应的锚在最顶上，这样就给用户带来了不好的体验，我试着想做一个当我点击这个链接的时候就会自己回到顶部，就是获取他的滚动条的高度，然后让滚动条的高变为0，其中的代码我就不演示了，就算是写了我说的这种方法，但是还是不美观，不是很建议用这种方法，但是对于我遇到的这种主管，这种还是可以的，希望对你有帮助