js を使わずに PHPだけで、loading メッセージを出して終わったら消す
金曜日, 5 月 30th, 2008
どうでもいい 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
echo “<div id=’loading’ style=’width:100%;margin:0;padding:0;height:100%;text-align:center;’>\n<div style=’position:absolute;top:50%;left:50%;margin-left:-7.5em;margin-top:-1em;’>\n<div style=’width:500px;’>\n<ul id=’loading’ style=’list-style-type: none;’>\n”;for ($i=0;$i<10;$i++) {
echo “<li style=’float:left;margin:0px;border:1px solid silver;background-color:cyan;color:cyan;’>|</li>\n”;
ob_flush;
flush;
sleep(1);
}echo “</ul>\n</div>\n</div>\n</div>”;
?>
html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>ローディングテスト</title><style>
#loading {
display:none;
}
</style>
</head><body>
全部完了したらこれだけが表示されます。
</body>
</html>