Javascript jquery ui对话框意外关闭

我打算使用jQueryUI实现交互式取消按钮对话框。当用户单击“取消”时，将显示弹出的“确认”对话框。当用户单击“是”时，它将根据响应状态进行响应。下面是我如何实现代码的

function refreshPage() {
window.location.reload(true);
}

$(function() {
setTimeout(refreshPage,30000);

var cancelJob = function(e) {
    e.preventDefault();
    $('.hiddenCancelPopup').dialog({
        modal: true,
        buttons: {
            "Yes": function() {
                var bookingJobNo = $('.cancelButton').attr("rel");
                var channel = $('.cancelButton').attr("channel");
                var deviceId = $('.cancelButton').attr("deviceId");
                if(readCookie("mbtx_session_id") == null) {
                    $(".invalidId").dialog({});
                    return;
                }
                jQuery.get('/rest/v2/booking/cancel/'+  bookingJobNo + "?channel=" + channel + "&deviceId=" + deviceId,  function(result) {
                    if(result.status == 501) {
                        $(".hiddenCancelledPopup").dialog({
                            modal: true,
                            buttons: {
                                "OK": function() {
                                    alert("OK");
                                    window.location.reload(true);
                                    //$( this ).dialog( "close" );
                                }
                            }
                        });
                    } else {
                        $(".hiddenFailedCancelPopup").dialog({
                            modal: true,
                            buttons: {
                                "OK": function() {
                                    $( this ).dialog( "close" );
                                }
                            }
                        });
                    }
                });
             },
            "No": function() {
                $(this).dialog("close");
            }
        }
    });
}

$(".cancelButton").on('click',cancelJob);

$("body").on({
    ajaxStart: function(cancelJob) {
        $(this).addClass("loading");
    },
    ajaxStop: function(cancelJob) {
        $(this).removeClass("loading");
        refreshPage();
    }
});

此实现的问题是，在显示

$（“.hiddenCancelledPopup”）.dialog

时，即使在用户单击

OK

按钮之前，对话框也意外关闭。它在消失之前显示了一段时间

---

我意识到

setTimeout（刷新页面，30000）（这意味着每30秒刷新一次）可能会导致问题，但我观察到对话框在30秒间隔之前关闭的时间要短得多。关于如何解决这个问题有什么想法吗？谢谢。
通过浏览您的代码，我怀疑问题在于ajax调用何时停止，即代码的以下部分

$("body").on({

    ajaxStart: function(cancelJob) {
        $(this).addClass("loading");
    },
    ajaxStop: function(cancelJob) {
        $(this).removeClass("loading");
        refreshPage();    //page refreshes after any ajax call stops after executing.
    }

});

很可能，当出现带有类
hiddenCancelledPopup
的UI对话框时，会执行
ajaxStop
函数中的代码，并按照您在其中调用的
refreshPage（）
刷新页面，因此弹出窗口会在任何用户交互之前消失

我不知道您的要求，但我的建议是，如果可能的话，在其他地方打电话给
refreshPage（）
。让我知道进展如何。
为
refreshPage
添加一个警报以确保安全。