求问。设置的header.php 怎么按照点击的不同的按钮给对应的按钮设置样式

设置的header.php 怎么按照点击的不同的按钮给对应的按钮设置样式


header.php是导航栏，里面有几个按钮指向不同的网页，
我想要的效果是 按了第一个按钮进入了1.php，然后这第一个按钮能有个背景色，按了第二个按钮进入了2.php，然后这第二个按钮能有个背景色，第一个按钮变成原来的样子。

回复讨论(解决方案)

http://www.16sucai.com/daima/cd/ 这种吗 很多别人写好的 直接加到自己项目

可不可以用js判断然后再怎么做

请在页面当中引入jquery.
header.php代码:

 

<script src="js/jquery-1.8.3.min.js"></script> <!--jquery文件请自行修改--><style>#m1{    height: 50px;    width: 500px;    background: beige;}#page1{    width: 50%;    height: 100%;    float: left;}#page2{    width: 50%;    height: 100%;    float: left;}</style><?php?><div id="m1">   <div id="page1">   <a href="1.php?id=1">网页1</a>   </div>   <div id="page2">   <a href="2.php?id=2">网页2</a>   </div></div>

1.php代码:

<script src="js/jquery-1.8.3.min.js"></script><style>#m1{    height: 50px;    width: 500px;    background: beige;}#page1{    width: 50%;    height: 100%;    float: left;}#page2{    width: 50%;    height: 100%;    float: left;}.onclick{    background: red;}</style><?php?><div id="m1">   <div id="page1">   <a href="1.php?id=1">网页1</a>   </div>   <div id="page2">   <a href="2.php?id=2">网页2</a>   </div></div><script>var id=<?php echo $_GET['id'];?>;$("#page" + id).siblings().removeClass('onclick');$("#page" + id).addClass('onclick');</script>

2.php代码:

<script src="js/jquery-1.8.3.min.js"></script><style>#m1{    height: 50px;    width: 500px;    background: beige;}#page1{    width: 50%;    height: 100%;    float: left;}#page2{    width: 50%;    height: 100%;    float: left;}.onclick{    background: red;}</style><?php?><div id="m1">   <div id="page1">   <a href="1.php?id=1">网页1</a>   </div>   <div id="page2">   <a href="2.php?id=2">网页2</a>   </div></div><script>var id=<?php echo $_GET['id'];?>;$("#page" + id).siblings().removeClass('onclick');$("#page" + id).addClass('onclick');</script>运行之后,你会得到你想要的.