聞く。 header.php設定でクリックされたさまざまなボタンに応じて、対応するボタンのスタイルを設定する方法-PHPチュートリアル-php.cn

聞く。 header.php設定でクリックされたさまざまなボタンに応じて、対応するボタンのスタイルを設定する方法

WBOY

リリース： 2016-06-23 13:47:51

オリジナル

872 人が閲覧しました

header.php セットでクリックされたさまざまなボタンに応じて、対応するボタンのスタイルを設定するにはどうすればよいですか?

header.php は、さまざまな Web ページを指す複数のボタンがあるナビゲーションバーです。最初の A ボタンを押すと 1.php が入力され、最初のボタンには背景色が入ります。2 番目のボタンを押すと 2.php が入り、2 番目のボタンは背景色を持ち、最初のボタンは元の外観になります。

ディスカッション (解決策) への返信

http://www.16sucai.com/daima/cd/ この種のものは他の多くの人が書いていて、自分のプロジェクトに直接追加できますか? js を使って判断するのですが、どうすればよいですか?

ページに jquery を導入してください:

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

ログイン後にコピー