jquery中的setinterval ui没有按预期工作

Question

我很难复制http://jsfiddle.net/fmLAq/

的功能

progressbar.progressbar({
    value: false,
    change: function() {
        progressLabel.text( progressbar.progressbar( "value" ) + "%" );
    },
    complete: function() {
        progressLabel.text( "Complete!" );
    }
});

function progress() {
    var val = progressbar.progressbar( "value" ) || 0;

    progressbar.progressbar( "value", val + 1 );

    if ( val < 99 ) {
        setTimeout( progress, 100 );
    }
}

IN

http://jsfiddle.net/x76ET/。我想在条形图中显示progressvalue，如上例所示。

任何人都可以帮我解决这个问题

Answer 1

var el = $('#my-progress');
var lab = $("#progress-label");
el.on('progressbarcreate', function (event, ui) {
    el.after('<p>Start value: ' + el.progressbar('value') + '</p>');
});

el.progressbar({
    change: function () {
        lab.text(el.progressbar("value"));
    },
    complete: function() {
        lab.text("Complete!");
    }
});

// animate progress
var count = 0;
var timer = setInterval(function () {
    if (count++ > 100) {
        // Stop repeating
        clearInterval(timer);
    } else {
        el.progressbar('value', count);
    }
}, 100);

FIDDLE