Question

我很难让我的进度条重置并继续计数。在我的代码中，我有一个按钮，打开一个带有进度条的JQuery ui对话框，进度条计数高达100％然后关闭。当我再次单击该按钮以重置进度条时，它只保持0％而不更新。这有什么我在代码中缺少的吗？

这是我的对话框

r.js

我打开对话框的按钮

$( "#dialog" ).dialog({
    autoOpen: false,
    dialogClass: "no-close", 
    draggable: false, 
    resizable: false, 
    height: 200, 
    width: 200          
});

我的进度条代码

$("#button").click(function() {
    $('#progressbar').progressbar('option','value', 0);
    $( "#dialog" ).dialog( "open" );
});

编辑：这是html

$(function() {
        var progressbar = $( "#progressbar" ),
        progressLabel = $( ".progress-label" );

        progressbar.progressbar({
            value: true,
            change: function() {
            progressLabel.text( progressbar.progressbar( "value" ) + "%" );
        },

        complete: function() {
            progressLabel.text( "Complete!" );
            setTimeout("$('#dialog').dialog('close')",3000);

            }
        });

           function progress() {
          var val = progressbar.progressbar( "value" );
          progressbar.progressbar( "value", val + 2 );
          if ( val < 99 ) {
            setTimeout( progress, 80 );
          }
        }
        setTimeout( progress, 2000 );
});

Answer 1

见fiddle（其他人开始）

单击按钮后，需要再次启动函数progress（）。您还应该确保progress（）函数在按钮单击事件的范围内。

$("#button").click(function() {
     $('#progressbar').progressbar('value', 0);
     $( "#dialog" ).dialog( "open" );
     //restart
     progress();
});

进度条不会正确重置

1 个答案: