ユーザーがサーバーへの呼び出しを待っている間、読み込みアニメーションを表示しようとしています。これを行うために、JQuery で div を表示しようとしましたが、Firefox でのみ機能します (IE や Chrome では機能しません)。
現在、BigSlowFuncCall には ac# しかありませんSystem.Threading.Thread.Sleep(10000);
ジャバスクリプト
function showloading() {
$('#content').hide();
$('#siteLoader').show();
}
function hideloading() {
$('#content').show();
$('#siteLoader').hide();
}
function CheckFields() {
showloading();
var jsHandler = new JsonHandler();
jsHandler.BigSlowFuncCall();
hideloading();
}
HTML
<div id="wrapper">
<div id="siteLoader" style="display:none;" >
<div id='siteDetailLoader'>
<img src='img/loading.gif' border='0' alt='cargando'>
Por favor, espera<br /> <br />
</div>
</div>
<div id="content">
<form>
<p>
/* Stuff */
</p>
<p class="submit"><input type="button" id="btn" onclick="CheckFields()" class="button-link" value="Descargar"/></p>
</form>
</div><!-- #content-->
</div><!-- #wrapper -->
これは Firefox では期待どおりに機能します (コンテンツを非表示にし、読み込みアニメーションを表示し、10 秒後に読み込みアニメーションを非表示にします) が、IE では、関数を終了した場合hideloading()
と CheckFields 関数を終了した後にのみ表示されます。
このような単純なコードが Firefox では正常に動作するのに IE では動作しないのはなぜでしょうか?
alert()
編集:後に を付けると、showloading()
完全に機能することがわかりました。だから、私はこれを検索して見つけました: JavaScript dom 操作後に Internet Explorer で DOM の更新を強制します。これhttps://stackoverflow.com/a/4271996/1824011を試しましたが、うまくいきませんでした。