ページの読み込み中に読み込む

Question

私はいくつかのページで時には時間がかかることがあるいくつかのPHPルーチンを実行するサイトを持っています。たとえば、1ページからフォームがあります：

connecting to a MySQL database 
performing a series of select queries to establish the data to display 
preparing the resulting page with data displayed. 

私はターゲットページ上読み込みGIFを入れて試してみましたが、それは私だけ一度に簡単にロードします。

<form action ="showdata.php"> 
    <input type="submit"> 
</form> 

は、ターゲットページがあると仮定しますクエリが完了したと考えられます。

CSS

.loader { 
top: 50%; 
left: 50%; 
width:6em; 
height:6em; 
margin-top: -3em; 
margin-left: -3em; 
border: 0px solid #ccc; 
background-color: #f3f3f3; 
position:fixed; 
background: url('../images/page-loader.gif') no-repeat; 
} 

SCRIPT

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(window).load(function() { 
    $(".loader").fadeOut("slow"); 
}) 
</script> 

HTML

<div class="loader"></div> 

どのように私はロードGIFが表示されるように得ることができます：私は、ターゲットページで、次のしているこれを行うには正しく？ IEがページが選択されるとすぐに。私はgifを表示してターゲットページにリダイレクトする途中のページを使ってこの問題を回避できることを読んでいるように思います。これはこの問題を解決する良い方法ですか、それとも良い方法がありますか？

Answer 1

あなたがしたいことは、フォームを使用してページにローディングGIFを追加し、ボタンをクリックしたときに表示することです。ターゲットページはサーバー側のPHPの処理が終わるとすぐにロードされるので、クリックするとすぐにローディングバーを表示すると、探している結果が得られる可能性があります。例えば

：

<script type="text/javascript"> 
$('.submit').on('click', function() { 
    $(".loader").fadeIn("slow"); 
}) 
</script>