IE11和Edge不会为CSS类加载背景图像，如果不立即使用，如何解决？

Question

我在Edge和IE11中遇到了以下问题。

有一个按钮作为div：

<div class='button loading'></div>

最初，它具有类"加载"，该类具有动画微调器图像。这很好用。

 .loading { background-image: url ('loading.gif'); }

当页面加载和其他一些操作完成后，"加载"类将更改为"ready"：

<div class='button ready'> </div>

它应该有另一个 bg 图像：

 .ready { background-image: url ('ready.svg'); }

问题是此图像（就绪.svg）未显示在背景中。更重要的是，如果我在页面末尾的隐藏 img 元素中调用此图像，一切正常：

<img src="ready.svg" style="display:none;" />

在我看来，IE11 和 Edge 没有加载或未将图像应用于div 的背景，如果在页面加载时没有立即使用它。难道是这样？谁面对这样的事情，如何摆脱这种行为？

Answer 1

在动态类添加中添加超时为我解决了IE和Edge中的问题（我正在使用jQuery）。

setTimeout(function(){
  $('#element').addClass('loading');
},1);

不完全确定为什么！我的类正在表单提交事件中添加，所以也许请求被阻止了？！希望这对某人有所帮助。