0

我想在提出ajax请求时添加一个进度条，进度条值由setTimeout更改。但是当我继续发送请求时，值会变得越来越快。下面是我的代码，有谁知道如何清除在 ajaxStart 部分设置的 ajaxStop 超时？如何清理所有超时？

var $reportContent = $("#reportDataDiasplay");
var timeOut;
$(document).ajaxStart(function(){   
    if($(".ui-dialog").length==0){
    $reportContent.append("<div id='progressBarDialog'><div id='progressbar'></div></div>");
    var $progressbarDialog = $("#progressBarDialog");           
    $progressbarDialog.dialog({
        modal: true,
        width:175,
        height:50,
        closeOnEscape: false,
        autoOpen: false 
    });             
    $(".ui-dialog-titlebar").hide();        
    }       
    var $progressbar = $( "#progressBarDialog #progressbar" );
    $progressbar.progressbar({value:false});    
    $progressbar.progressbar( "value",0 ); 
      function progress() {
          clearTimeout(timeOut);
            var val = $progressbar.progressbar( "value" ) || 0;
            if ( val < 75 ) { 
                $progressbar.progressbar( "value", val + Math.random() * 25  ); 
                 }  
            if(val < 99){
                timeOut = setTimeout( progress, 300 );
            }
         }       
      timeOut = setTimeout( progress, 300 );
    $("#progressBarDialog").dialog("open");         
});
$(document).ajaxStop(function(){        
    $("#progressBarDialog").dialog('close');
});
4

2 回答 2

4

如果您要问如何清除超时，那么您所要做的就是利用clearTimeout();

将您分配setTimeout()给一个变量（您已经拥有），例如

timeOut = setTimeout(progress, 300);

然后当你想清除它时使用clearTimeout(timeOut);

要知道您的超时何时运行，以便您知道是否设置一个新的超时，您可以在使用 setTimeout() 时为变量分配一个值；每当您清除超时或结束时，将该值设置为 false。如果该值为 false，则仅启动新的 setTimeout()。

于 2013-09-10T08:02:11.300 回答
0

我找到了重点，我应该把我的超时部分放到初始部分（新对话判断）。因为如果你在 startAjax 部分提出新的超时，每次你发送 ajax 请求都会有一个新的超时，这些循环一起工作，所以进度条的变化越来越快。clearTimeout(timeOut);不起作用，因为将新提出一个新的进度功能。下面是我修改后的代码。可能对你有帮助~~ 顺便说一句，有人可以投票给我一次吗？我想加入聊天部分，但是需要20声望值~~

$(document).ajaxStart(function(){   
    if($(".ui-dialog").length==0){
    $reportContent.append("<div id='progressBarDialog'><div id='progressbar'></div></div>");
    $( "#progressBarDialog #progressbar" ).progressbar({value:false});      
    var $progressbarDialog = $("#progressBarDialog");           
    $progressbarDialog.dialog({
        modal: true,
        width:175,
        height:50,
        closeOnEscape: false,
        autoOpen: false 
    });             
    $(".ui-dialog-titlebar").hide();    
     function progress() {
            var val = $progressbar.progressbar( "value" ) || 0;
            if ( val < 80 ) { 
                $progressbar.progressbar( "value", val + Math.random() * 15  );
                timeOut = setTimeout( progress, 500 );
                 }  
         }       
      setTimeout( progress, 500 );

    }       
    var $progressbar = $( "#progressBarDialog #progressbar" );      
    $progressbar.progressbar( "value",0 ); 
    $("#progressBarDialog").dialog("open");         
});
$(document).ajaxStop(function(){    
    $( "#progressBarDialog #progressbar" ).progressbar( "value",0 ); 
    $("#progressBarDialog").dialog('close');
});
于 2013-09-10T08:28:34.657 回答