求问。设置的header.php 如何按照点击的不同的按钮给对应的按钮设置样式-PHP Tutorial-php.cn

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

WBOY

Release： 2016-06-13 12:07:43

Original

1086 people have browsed it

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

header.php是导航栏，里面有几个按钮指向不同的网页，
我想要的效果是按了第一个按钮进入了1.php，然后这第一个按钮能有个背景色，按了第二个按钮进入了2.php，然后这第二个按钮能有个背景色，第一个按钮变成原来的样子。
------解决思路----------------------
http://www.16sucai.com/daima/cd/ 这种吗很多别人写好的直接加到自己项目
------解决思路----------------------
请在页面当中引入jquery.
header.php代码:

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

Copy after login

1.php代码:

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

Copy after login

2.php代码:

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

Copy after login