htmlフレームと同じで、画面をいくつかに分けて、小さなコンテンツを組み合わせた大きなページを作ることが可能なので、phpは好きだ。
フレームだと簡単だけどphpじゃ難しいことが一つある。ページ全体を再読み込みせずに、小さなコンテンツの表示だけ、文章だけを切り替えることだ。
例:2ちゃんねる
このページは左のメニューをクリックすると右のフレームに掲示板が表示される仕組みになっている。左のメニュー画面は再読み込みされない。
こういう仕組みを、phpでも作りたいと思った。だけど出来ない。
JavaScriptを使えばいけることがわかったので、書いていく。(リンク先サイトを超参照した。すべてのphpは文字コードをutf-8にして保存すること。)
<head> <script type="text/javascript"> <!-- var txt1 = "<?php require 'red.php' ?>"; var txt2 = "<?php require 'blue.php' ?>"; var txt3 = "<?php require 'yellow.php' ?>"; function ChangeTxt(txt) { document.getElementById("text").innerHTML=txt; } --> </script> </head> <body> <div id="text">ここの文章を変える</div> <ul> <li><a href="javascript:void(0)" onclick="ChangeTxt(txt1); return false;">赤</a></li> <li><a href="javascript:void(0)" onclick="ChangeTxt(txt2); return false;">青</a></li> <li><a href="javascript:void(0)" onclick="ChangeTxt(txt3); return false;">黄色</a></li> </ul> </body> |
<head>~</head>の間にJavaScriptの記述を書く。txt1~txt3のそれぞれの変数の中にphpの命令を入れる。php requireは当該phpのページの中に別のphpのデータを持ってくる命令だ。別のphpの中身は以下のとおり。一文だけ書いて、文字コードutf-8でそれぞれの名称で保存するだけ。
red.php | | 赤は英語で<strong>red</strong>です。 |
blue.php | | 青は英語で<strong>blue</strong>です。 |
yellow.php | | 黄色は英語で<strong>yellow</strong>です。 |
phpファイルのファイル名を変えたらtxt1~3で読み込むphp requireのファイル名を変えればいいだけ。クリックする文字を変えたかったら、<li>~</li>の中の文字を変えればいい。
とっても簡単。これで出来上がり。
しかし大きな問題があった。requireしたphpに改行があるとうまく読み込んでくれないのだ。上手に変数でなんとかすると出来るみたいだけどややこしい。やっぱりJavascriptはあきらめて、phpでやったほうがはやそうなので、phpでやってみた。
→phpを使ってページの文章を切り替える方法
0 件のコメント:
コメントを投稿