0

我有一个 jquery 确认对话框。当用户按下 OK 时，我会执行一个 Ajax 调用，这需要几秒钟。在这个延迟期间，我想在对话框上显示一个 gif 动画，以便用户知道我们正在处理他们的数据。但是，我似乎无法让 gif 出现在对话框中。

html是：

<div id="dlgReleaseConfirmation" title="ConfirmRelease" style="display : none"  >
    <div id="release-in-progress" style="display:none">
            <img src="images/ajax-loader.gif" ></img>
    </div>
</div>

js文件中的代码是：

       $("#dlgReleaseConfirmation").dialog({
        modal: true,
        buttons: {
            "Release": function () {
                $("#release-in-progress").show();       // show the busy div - not working, blocked by dialog?
                Release();   // release assays
                loadTable();           // refresh datatable
                $("#release-in-progress").hide();       // hide the busy div
                $(this).dialog("close");    // close this dialog
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }

谁能看到我做错了什么？

更新解决方案。

亚历山大让我走上了正确的道路。底线是您必须异步执行 Ajax 调用，以便更新对话框以显示忙碌指示符。但是，如果只是这样做，那么问题就变成了代码将继续并关闭屏幕，而 ajax 调用继续异步，因此不会向用户提供任何反馈。

为了解决这个问题，我添加了对 ajaxStart() 和 ajaxStop() 的调用，以在异步 Ajax 调用进行时隐藏和显示忙碌指示符。这是有效的释放按钮处理程序代码：

"Release": function () {
    $(this).ajaxStart(function () {
        $("#release-in-progress").show();   
    });
    $(this).ajaxStop(function () {
        $("#release-in-progress").hide();
        $(this).dialog("close");    // close this dialog
    });
    Release();   // release assays
    loadTable();           // refresh datatable
 };
4

1 回答 1

1

通过在函数中执行同步 AJAX 调用 ( async: false)，loadTable()您将冻结执行，直到请求完成并且图像资源没有被加载。您需要使用异步调用来实现您想要的。

于 2012-12-10T18:23:49.463 回答