2

我有一种情况，用户与模式对话框进行交互，并且在提交和关闭表单时，站点会从服务器获取和下载文档，这有时可能需要一段时间。所以效果是对话框消失，正常页面显示几秒钟。favicon 变为微调器，箭头旁边有一个微调器，但我想更清楚地表明该站点仍在按预期工作。

我使用 bootstraps hidden.bs.modal 触发器来调用 $.blockUI ，它会设置一个微调器。这是一些代码。

$('#projectsiteitemsdialog').on('hidden.bs.modal', function () {
  if (isLoading) {
    doSpinner();
  }
  isLoading = false;
});

function doSpinner() {
  $.blockUI({
    message:
        $("#spinner"),
    css:
        {
            top: ($(window).height() - 30) / 2 + "px",
            left: ($(window).width() - 30) / 2 + "px",
            width: "30px"
        },
    overlayCSS:
    {
        backgroundColor: "#fff"
    }
  })
};

我得到的效果几乎符合预期。BlockUI 设置了白色背景颜色，但没有旋转 gif 显示。当不涉及 Bootstrap 模式时，该 gif 显示页面上调用 doSpinner 的其他按钮。

如果我使用 hide.bs.modal 我可以看到微调器，但只是在它与 Bootstrap 模态一起关闭之前的片刻。

有什么建议么？

4

0 回答 0