Question

我的目标是在进行AJAX调用时显示加载弹出窗口（包含GIF）。我正在使用jQuery UI Modal dialog，我在其中使用CSS插入GIF动画。之前，AJAX调用开始，我打开对话框并在调用结束后立即关闭它。问题是当AJAX调用正在运行时GIF停止工作并且它在所有浏览器中发生。我使用以下代码：

<div id="loadingScreen" title="Loading">Please wait...</div>

#loadingScreen {
    background: url(http://regretless.com/stuff/jQuery/images/loading.gif) no-repeat 5px 8px;
    padding-left: 25px;
}

$("#loadingScreen").dialog('open');
setTimeout(function () {
  $.ajax({
    type: "GET",
    url: "testing.txt",
    async: true,
    dataType: "text",
    success: function (returnText) {
      $("#viewDescription").text(returnText);
      $("#viewGroupID").text(" " + t.id);
      $("#loadingScreen").dialog('close');
      $('#View').dialog('open');
    },
    error: function (xhr, status, error) {
      $("#loadingScreen").dialog('close');
      alert("An error has occured");
    }
  });
}, 10);

有人可以告诉我问题可能是什么吗？

Answer 1

因为这是一个背景，你需要将焦点设置为#loadingScreen以保持动画的运行。

为什么GIF动画在进行AJAX调用时会停止工作？

1 个答案: