Question

我有一个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
 };

Answer 1

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

Jquery Dialog中没有显示忙碌指示符

1 个答案: