1

我以前一直在处理这个问题,但似乎问题又回来了。让我解释。

我有一个网页可以让用户上传一个大文件,之后 ASP.NET 服务器端脚本也可能需要几秒钟来处理它。与此同时,我想在 Web 浏览器中显示加载器/微调器动画,以防止用户再次单击提交按钮。

我使用了以下 JQuery 代码:

$('#ButtonImportData').click(function () {
    $('.importSubmitSpinner').css('display', 'inline');
}

这是微调器图像的 HTML:

<img src="Graphics/spinner_big.gif" width="28" height="28" class="importSubmitSpinner" alt="Spinner" />

这是CSS:

.importSubmitSpinner
{
    margin: 0px 10px 0px 6px;
    width: 28px;
    height: 28px;
    display: none;
}

spinner_big.gif 是一个带有动画的简单 GIF 文件,用于向用户发出页面正在加载的信号。

上述方法几乎适用于所有浏览器,除了......猜猜哪一个?是的,IE!在 IE 中发生的情况是,在用户单击 ButtonImportData 按钮后,将显示微调器,但动画立即停止,基本上给用户一个错误的指示,表明页​​面已挂起,提示他们再次单击提交 - 与我的相反想做。

我很久以前就停止使用 IE,但显然有大约一半的互联网社区仍在使用它。伙计,人们怎么能使用那块 *&^% 呢?无论如何,这不是一个问题 :) 问题是,如何让这个简单的任务在 IE 中工作并让我的动画真正播放?

PS。我一直在使用 IE 9 或 Windows 7 的当前“网络之美”对其进行测试。

编辑:

感谢ShadowScripter,我找到了解决方案。这对我有用:

1 将以下内容添加到 HTML 以确定我们是否在 IE 上运行(因为我们不需要对任何其他 Web 浏览器执行此“破解”):

<![if !IE]>
<script type='text/javascript'>
var bNotIE = 1;
</script>
<![endif]>

2 我们需要给img元素添加ID:

<img src="Graphics/spinner_big.gif" width="28" height="28" class="importSubmitSpinner" alt="Spinner" id="imgSpinnerImport" />

3 然后显示GIF动画:

$('#ButtonImportData').click(function () {
    //For "normal" browsers
    $('.importSubmitSpinner').show();

    if (typeof (bNotIE) == 'undefined') {
        //The following must be done only in case of IE
       //NOTE: We need to load the same file but with a different name
       //   because if you don't change the file name it won't work!
        setTimeout('document.images["imgSpinnerImport"].src = "Graphics/spinner_big_ie.gif"', 200);
    }
}
4

2 回答 2

1

我似乎无法在任何 IE 版本中复制您的问题。

这是我测试过的现场示例。

您的原因可能有很多不同的原因。

  • 其他代码可能会干扰
  • GIF 图像有问题
  • 客户端计算机;工作量

哦,还有,

你可以使用.show()而不是必须做的.css("display", "inline")事情。
如果没有指定,JQuery 可以识别元素应该具有的默认显示模式。

于 2012-04-10T10:41:23.693 回答
1

试试这个效果很好...

setTimeout(function() {
     ('.out').css("display","none");    
     $('#load').show();         
     return true;
}, 100);

在实际显示加载程序图像之前延迟 100 毫秒。

于 2013-06-21T13:31:14.177 回答