Rumah > pembangunan bahagian belakang > tutorial php > 求问。设置的header.php 怎么按照点击的不同的按钮给对应的按钮设置样式

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

WBOY
Lepaskan: 2016-06-23 13:47:51
asal
871 orang telah melayarinya

设置的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>
Salin selepas log masuk


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>
Salin selepas log masuk


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>运行之后,你会得到你想要的.
Salin selepas log masuk

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan