在IE中提交动画问题

我以前一直在处理这个问题，但似乎问题出现了。让我解释。在IE中提交动画问题

我有一个网页，可以让用户上传一个大文件，之后，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浏览器上运行（因为我们不需要做这个“黑客”对任何其他网络浏览器）：

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

2我们需要ID添加到img元素：

<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); 
    } 
}

来源

2012-04-10 ahmd0

你在说哪个版本的IE？你有没有试过jQuery BlockUI插件。它似乎是浏览器兼容... http://jquery.malsup.com/block/ – 2012-04-10 07:41:49

IE 9 ............ – ahmd0 2012-04-10 07:42:31

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

Here's the live example我测试了它。

可以有很多不同的原因，为什么你不工作。

其他代码可能会干扰
GIF图像故障
客户端计算机;工作量

哦也，

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

来源

2012-04-10 10:41:23 ShadowScripter

这完全让我感到困惑。这里可能是什么情况？在这个简单的例子中，它工作得很好。我从脚本运行相同的脚本，相同的图像等，它不会旋转！在我的情况下，该页面是由ASP.NET脚本组成的，如果将其打开以查看为HTML，则会添加大量垃圾/垃圾......该死，MS！ – ahmd0 2012-04-10 20:00:09

在任何情况下，问题都与您提供的不符。除非你想让我调试你的整个站点，否则我没有太多的工作可以帮助，而且我并不是那样的人） – ShadowScripter 2012-04-10 20:02:44

我更新了它在代码中的样子，它在那里工作：http：// jsfiddle .net/HPW9R/2但为什么不在我的网页？这只是迫使我浪费时间在这个*＆^％!!!! – ahmd0 2012-04-10 20:04:04

由100ms的defore实际显示图像装载机试试这个它的伟大工程......

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

延迟。

来源

2013-06-21 13:31:14 Umi

这是@ShadowScripter上面的链接所做的（检查注释。）顺便说一下，仍然不能在IE10中工作，或者现在是什么...... – ahmd0 2013-06-21 16:46:06

This具体的解决方案帮助我的非asp相关问题。谢谢！ – 2013-07-02 17:46:00

在IE中提交动画问题

回答

相关问题