Javascript 在进行ajax调用的setInterval中删除blockUI

我有以下代码片段，其中每隔5秒进行一次ajax调用，以检查响应是否为真。用户界面将被阻止，直到收到的响应为真，当响应为真时，用户界面将被取消阻止。我正在使用Jquery blockUI v1.0插件来阻止UI：

$.fn.suspendResumeonConfirm=function(caseNumber,correlationId){ 
var contents=$('<table style="width:240px;"><tr><td align="center" style="padding: 5px;">Waiting for Response</td></tr><tr><td  align="center" style="padding: 5px;">'+
        '<div id="testProgress"  style="height:10px;background:#f1f1f1;"></div></td></tr><tr><td  align="center" style="padding: 5px;">'+
        '<label class="remainingTime">  </label> Seconds Remaining</td></tr></table>');
        contents.find('div#testProgress').progressbar("destroy").progressbar({value:0}).css("border","1px solid #e4e4e4");
        var progressUpdate=$("<div id='progressUpdate'></div>").append(contents);           
        var timeOut=0,
        response=false;         
        $("body").blockUI(true,{message:progressUpdate,css:{width:250}});
        var interval=setInterval(function() {               
            timeOut++;
            if(timeOut % 5==0){
                var param='entityNumber='+caseNumber+'&correlationId='+correlationId+'&entityType=Case&status=REQ';
                $(this).cAjax('POST','CheckRequestStatus.action',param,false,false,'','Error', true);
                response=strResponseText;
                //$(this).cAjax('POST', 'CheckRequestStatus.action',param,true,true,'serviceCallBack','Error', true,{timeOut:timeOut});
                $('#testProgress').progressbar("option", "value", (timeOut/serviceAlterationTimeout)*100);
                $("div#progressUpdate label.remainingTime").text((serviceAlterationTimeout-timeOut));
            }
            if(timeOut==60){
$('#testProgress').progressbar("option", "value", (timeOut/serviceAlterationTimeout)*100);
                $("div#progressUpdate label.remainingTime").text((serviceAlterationTimeout-timeOut));           
                $("body").blockUI(false);                   
                clearInterval(interval);
 }
        }
        , 1000);
};

$.fn.cAjax =  function(cType, cUrl, cData, cCache, cAsync, cFn, cAlert, cPrData,     functionArguments)
{
var self = $(this).eq(0),
    xhrObj = {};
try{
    strResponseText = "";
    xhrObj = $.ajax({
        type: cType,
        url: cUrl,
        data: cData,
        cache: cCache,
        async: cAsync,
        processData:cPrData? true : false,
        // ; Event will be called on Ajax SUCCESS
        success: function(data, textStatus, XMLHttpRequest) {
            if  ((typeof data).toUpperCase() == "OBJECT"){  
                data = JSON.stringify(data);
            }
                if(data.indexOf('Session Expired') != -1){
                    $(window.location).attr('href',  'Dashboard.action');
                }
                else if(data =="System error")
                {
                    var btnObject = {
                            "OK": function()   {$(this).dialog('close');}};
                      $(this).removeLoadingMsg().cDialog('customErrorDialog',sysErrorObj[0],sysErrorObj[1],false,true,null,null,btnObject,false,null,false,"slide","center");
                }
                else{
                    if(cFn && cFn != '')
                    {
                        if(typeof functionArguments ==   'boolean' || functionArguments)
                            self[cFn](data,   functionArguments);       //calling function by jquery Object notation    
                        else
                            self[cFn](data);
                    }
                    strResponseText = data;
                    return data;
                }
                return false;
    },

        // ; Event will be called on Ajax ERROR
        error:function (xhr, ajaxOptions, thrownError){
                var btnObject = {
                        "OK": function()  {$(this).dialog('close');}},errLabelCon = "";

                errLabelCon = $(this).errorCode(xhr.status);
                errLabelCon = errLabelCon.split(",");
                //abort handling. Callback function will receive   first argment as string "ABORT" and passed arguments if any
                if(ajaxOptions == "abort")
                {
                    if(cFn && cFn != '')
                    {
                        if(typeof functionArguments == 'boolean' || functionArguments)
                            self[cFn]("ABORT", functionArguments);      //calling function by jquery Object notation    
                        else
                            self[cFn]("ABORT");
                    }
                }
                else if(errLabelCon.length == 2)
                // replaced removeLoadingMsg with blockUI so that   current loading should be remove not all
                       $(this).blockUI(false).cDialog(null,errLabelCon[0],errLabelCon[1],false,true,null,null,btnObject,false,null,false,"slide","center");
    },

        // ; Event will be called on Request Complete
        complete:function(XMLHttpRequest,textStatus){
                //; alert("Complete:  "+strResponseText+"  "+textStatus+" "+XMLHttpRequest);
                if(strResponseText.indexOf('Session Expired') != -1){
                    $(window.location).attr('href', 'Dashboard.action');
                }
                if(strResponseText=="System error")
                {
                    var btnObject = {
                            "OK": function(){$(this).dialog('close');}};
                    $(this).removeLoadingMsg().cDialog('customErrorDialog',sysErrorObj[0],sysErrorObj[1],false,true,null,null,btnObject,false,null,false,"slide","center");
                }
    }
    });
    //store the XHR object so that it can be used while ajax in progress
    $(this).data("xhr", xhrObj);
}
catch(e){
    var btnObject = {
            "OK": function(){$(this).dialog('close');},
            "Click to Login": function(){$(this).dialog('close');$(window.location).attr('href', 'LogonFwdAction.action');}};
    var exception = sysErrorObj[1];

    exception += "<br />"+e;

    $(this).cDialog('customErrorDialog',sysErrorObj[0],exception,false,true,null,null,btnObject,false,null,false,"slide","center");
}
};

$.fn.suspendResumeOnConfigRM=函数（caseNumber，correlationId）{
var contents=$（“等待响应”+
''+
“剩余秒”）；
contents.find（'div#testProgress'）.progressbar（“destroy”）.progressbar（{value:0}）.css（“border”，“1px solid#e4”）；
var progressUpdate=$（“”）。追加（内容）；
变量超时=0，
响应=错误；
$（“body”）.blockUI（true，{message:progressUpdate，css:{width:250}}）；
var interval=setInterval（函数（）{
超时++；
如果（超时%5==0）{
var param='entityNumber='+caseNumber+'&correlationId='+correlationId+'&entityType=Case&status=REQ'；
$（this.cAjax（'POST'，'CheckRequestStatus.action'，param，false，false'，'Error'，true）；
响应=strResponseText；
//$（this.cAjax（'POST'，'CheckRequestStatus.action'，param，true，true，'serviceCallBack'，'Error'，true，{timeOut:timeOut}）；
$（'#testProgress'）.progressbar（“选项”，“值”，“超时/服务更改超时）*100）；
$（“div#progressUpdate label.remainingTime”）.text（（serviceAlterationTimeout））；
}
如果（超时==60）{
$（'#testProgress'）.progressbar（“选项”，“值”，“超时/服务更改超时）*100）；
$（“div#progressUpdate label.remainingTime”）.text（（serviceAlterationTimeout））；
$（“正文”）.blockUI（假）；
间隔时间；
}
}
, 1000);
};
$.fn.cAjax=函数（cType、cUrl、cData、cCache、cAsync、cFn、cAlert、cPrData、functionArguments）
{
var self=$（this）.eq（0），
xhrObj={}；
试一试{
strResponseText=“”；
xhrObj=$.ajax({
类型：cType，
url:cUrl，
数据：cData，
缓存：cCache，
异步：cAsync，
processData:cPrData？真：假，
//；活动将在Ajax成功后举行
成功：函数（数据、textStatus、XMLHttpRequest）{
如果（（数据类型）.toUpperCase（）=“对象”）{
data=JSON.stringify（数据）；
}
if（data.indexOf（'Session Expired'）！=-1）{
$（window.location.attr（'href'，'Dashboard.action'）；
}
else if（数据==“系统错误”）
{
变量btnObject={
“OK”：函数（）{$（this）.dialog（'close'）；}；
$（this）.removeLoadingMsg（）.cDialog（'customErrorDialog'，sysErrorObj[0]，sysErrorObj[1]，false，true，null，null，btnoObject，false，null，false，“幻灯片”，“中间”）；
}
否则{
如果（cFn&&cFn！=''）
{
if（函数参数的类型=='boolean'| |函数参数）
self[cFn]（数据、函数参数）；//通过jquery对象表示法调用函数
其他的
自我[cFn]（数据）；
}
strResponseText=数据；
返回数据；
}
返回false；
},
//；事件将在Ajax错误时调用
错误：函数（xhr、ajaxOptions、thrownError）{
变量btnObject={
“OK”：函数（）{$（this）.dialog（'close'）；}}，errLabelCon=“”；
errLabelCon=$（this）.errorCode（xhr.status）；
errLabelCon=errLabelCon.split（“，”）；
//中止处理。回调函数将以字符串“abort”形式接收第一个参数，并传递参数（如果有）
if（ajaxOptions==“中止”）
{
如果（cFn&&cFn！=''）
{
if（函数参数的类型=='boolean'| |函数参数）
self[cFn]（“ABORT”，functionArguments）；//通过jquery对象表示法调用函数
其他的
自我[cFn]（“中止”）；
}
}
else if（errLabelCon.length==2）
//将removeLoadingMsg替换为blockUI，因此应移除当前加载，而不是全部
$（this）.blockUI（false）.cDialog（null，errLabelCon[0]，errLabelCon[1]，false，true，null，null，btnObject，false，null，false，“幻灯片”，“中间”）；
},
//；事件将在请求完成时调用
完成：函数（XMLHttpRequest，textStatus）{
//；警报（“完成：”+strResponseText+“”+textStatus+“”+XMLHttpRequest）；
if（strResponseText.indexOf（'Session Expired'）！=-1）{
$（window.location.attr（'href'，'Dashboard.action'）；
}
如果（strResponseText==“系统错误”）
{
变量btnObject={
“OK”：函数（）{$（this）.dialog（'close'）；}；
$（this）.removeLoadingMsg（）.cDialog（'customErrorDialog'，sysErrorObj[0]，sysErrorObj[1]，false，true，null，null，btnoObject，false，null，false，“幻灯片”，“中间”）；
}
}
});
//存储XHR对象，以便在进行ajax时使用它
$（此）.data（“xhr”，xhrObj）；
}
捕获（e）{
变量btnObject={
“OK”：函数（）{$（this）.dialog（'close'）；}，
“单击以登录”：function（）{$（this）.dialog（'close'）；$（window.location）.attr（'href'，'LogonFwdAction.action'）；}；
var exception=sysErrorObj[1]；
异常+=“
”+e；
$（this.cDialog（'customErrorDialog'，sysErrorObj[0]，例外
$.fn.suspendResumeonConfirm = function(caseNumber,correlationId) {
    var contents = $('<table style="width:240px;"><tr><td align="center" style="padding: 5px;">Waiting for Response</td></tr><tr><td align="center" style="padding: 5px;">'+
        '<div id="testProgress" style="height:10px;background:#f1f1f1;"></div></td></tr><tr><td align="center" style="padding: 5px;">' +
        '<label class="remainingTime">  </label> Seconds Remaining</td></tr></table>');
    contents.find('div#testProgress').progressbar("destroy").progressbar({value:0}).css("border", "1px solid #e4e4e4");
    var progressUpdate = $("<div id='progressUpdate'></div>").append(contents);
    var timeOut = 0,
        pollInterval = 5,//seconds
        $$ = {//cache of jQuery objects
            body: $("body"),
            testProgress: $('#testProgress'),
            remainingTime: $("div#progressUpdate label.remainingTime")
        };
    $$.body.blockUI(true, { message:progressUpdate, css:{width:250} });
    function unblockUI() {
        $$.body.blockUI(false);
        clearInterval(interval);
    }
    var param = {'entityNumber':caseNumber, 'correlationId':correlationId, 'entityType':'Case', 'status':'REQ'};
    var interval = setInterval(function() {
        var xhr = $(this).data("xhr");//previous xhr object
        if(xhr) {//if there was a previous iteration
            if(xhr.abort) {
                xhr.abort();//abort
            }
            else if(xhr.reject) {
                xhr.reject();//or reject
            }
        }
        timeOut += pollInterval;
        var def = $.Deferred();
        var xhr = $(this).cAjax('POST', 'CheckRequestStatus.action', param, false, false, true, def);
        $(this).data("xhr", xhr);
        $.when(def).done(function(data) {
            //do other stuff here??
            if(data ...) {//test for a successful response
                unblockUI();
            }
            else {
                $(this).removeLoadingMsg();//??
            }
        }).fail(function(action) {
            switch(action) {
                case "abort":
                    $(this).whatever("ABORT", ...);
                break;
                case 'Session Expired':
                    window.location.href = 'Dashboard.action';
                break;
                case 'System error':
                    $(this).removeLoadingMsg();
                break;
            }
        });
        $$.testProgress.progressbar("option", "value", (timeOut/serviceAlterationTimeout)*100);
        $$.remainingTime.text((serviceAlterationTimeout-timeOut));
    }, pollInterval * 1000);
    setTimeout(unblockUI, serviceAlterationTimeout);//timeout
};

$.fn.cAjax = function(cType, cUrl, cData, cCache, cAsync, cPrData, def) {
    var xhrObj,
        btnObject = {
            "OK": function() {
                $(this).dialog('close');
            }
        };
    try {
        return $.ajax({
            type: cType,
            url: cUrl,
            data: cData,
            cache: cCache,
            async: cAsync,
            processData: cPrData ? true : false,
            success: function(data, textStatus, XMLHttpRequest) {
                if((typeof data).toUpperCase() == "OBJECT") {
                    data = JSON.stringify(data);
                }
                if(data.indexOf('Session Expired') != -1) {
                    def.reject('Session Expired');
                }
                else if(data == "System error") {
                    $(this).cDialog('customErrorDialog', sysErrorObj[0], sysErrorObj[1], false, true, null, null, btnObject, false, null, false, "slide", "center");
                    def.reject('System error');
                }
                else {
                    def.resolve(data);
                }
            },
            error: function (xhr, textStatus, thrownError) {
                var errLabelCon = $(this).errorCode(xhr.status).split(",");
                if(textStatus !== "abort" && errLabelCon.length == 2) {
                    $(this).cDialog(null, errLabelCon[0], errLabelCon[1], false, true, null, null, btnObject, false, null, false, "slide", "center");
                }
                def.reject(textStatus);
            }
        });
    }
    catch(e) {
        var btnObject2 = $.extend(btnObject, {
            "Click to Login": function() {
                $(this).dialog('close');
                $(window.location).attr('href', 'LogonFwdAction.action');
            }
        });
        var exception = sysErrorObj[1] + "<br />" + e;
        $(this).cDialog('customErrorDialog', sysErrorObj[0], exception, false, true, null, null, btnObject2, false, null, false, "slide", "center");
        return $.Deferred().promise();//dummy promise instead of xhr
    }
};