js を使わずに PHPだけで、loading メッセージを出して終わったら消す
どうでもいい php tips
こんなことがあるので
管理画面を作っていて
長い処理とかでブラウザのタイムアウトとかを防ぐ為に
php だと
echo “Now Loading…”;
処理やってる間１ループごとに
echo “.”;処理が終わってから
echo “End.”;
とか echo したりすると思うんですが、
それがお客にも見せるようなものだったりする特殊な場合
（ユーザがタイムアウトしそうな処理全部かもしれないけど）
echo した Now Loading… が画面にずっと残っちゃってうざいね
ってことで、 それを js を使わずに消してしまおうと。
魔法を使って解決します
魔法でも なんでもないんだけどｗ
こうする。
echo “<div id=’loading’>Now Loading…”;
処理やってる間１ループごとに
echo “.”;処理が終わってから
echo “End.</div>”;
とPHPで書いておいて
CSS で
#loading {
display:none;
}
こう書けばOK。
これで、処理中は …. がどんどん増えていって
End が表示されて、
その後PHPの残りのプログラムが処理されて、
最後に html を生成して、display:none が当たって見えなくなるわけです。
HTMLの読み込み時間差を利用するかんじ。
応用するとこんなことが
PHPとCSSだけで可能です。
ちなみにこれのソースはこんなかんじ。
<?php
ob_start();
echo "
<div id='loading' style='width:100%;margin:0;padding:0;height:100%;text-align:center;'>
<div style='position:absolute;top:50%;left:50%;margin-left:-7.5em;margin-top:-1em;'>
<div style='width:500px;'>
<ul id='loading' style='list-style-type: none;'>
";for ($i=0;$i<10;$i++) {
echo "<li style='float:left;margin:0px;border:1px solid #eeeeee;background-color:#F03B58;color:#F03B58;'>|</li>\n";
ob_flush();
flush();
sleep(1);
}echo " </ul>
</div>
</div>
</div>
";?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>ローディングテスト
<style>
#loading {
display:none;
}
</style>
</head><body>
全部完了したらこれだけが表示されます。
</body>
</html>
</pre>
