在 IE 中等待服务器端代码时加载动画答案

【问题标题】：Loading animation while waiting for server-side code in IE在 IE 中等待服务器端代码时加载动画
【发布时间】：2013-01-31 12:11:36
【问题描述】：

我试图在用户等待调用服务器时显示加载动画。为此，我尝试使用 JQuery 显示一个 div，但它仅适用于 Firefox（不适用于 IE 或 Chrome）。

目前，BigSlowFuncCall 只有一个 c# System.Threading.Thread.Sleep(10000);

JAVASCRIPT

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 上却不行？

编辑：我看到如果我在showloading() 之后放置一个alert()，它会完美运行。所以，我搜索并找到了这个：Forcing a DOM refresh in Internet explorer after javascript dom manipulation。我试过这个https://stackoverflow.com/a/4271996/1824011，但也没有用。

【问题讨论】：

标签： javascript jquery internet-explorer

【解决方案1】：

也许对你有帮助；

function checkFileds()
{
    var overlay = jQuery('<div id="overlay" align="center"><img src="images/preloader_bajaj.gif" width="125" height="125"  style="margin-top:300px" /> </div>');
    overlay.appendTo(document.body)

.......your code.......

}

【讨论】：

但是如何隐藏内容呢？
document.getElementById("overlay").style.display="none";
我的意思是在等待过程完成时必须隐藏的内容 div。我无法删除它，因为我可能需要再次显示它。
document.getElementById("overlay").style.display="none";不会删除它，.....如果你想再次显示，那么你可以使用 document.getElementById("overlay").style.display="block";
我已经尝试使用 display 属性来隐藏或显示 div，但它也不起作用。

【解决方案2】：

你错过了什么吗？隐藏函数中的 $ 符号丢失。 IE 对这种类型的错误非常敏感。更正代码并尝试一下。

【讨论】：

我在将代码复制到帖子时引入了该错误。不过谢谢。