更新运行时添加的 JQuery 进度条

我在更新 jquery 进度条时遇到一些问题。在页面加载期间，此进度条不在文档中，我只是在用户单击按钮时添加它，如下所示：

$(this).parent().append('<div class="progressbar"></div>');
$(this).parent().children('div.progressbar').show();
$(this).parent().children('div.progressbar').progressbar({value: 20});

然后，使用超时，我尝试更新它

function updateProgressBar() {
    $('.progressbar').each(function() {
        myNewValue = getNewValue();
        $(this).progressbar('value', 50);
    });
    setTimeout('updateProgressBar()', 5000);
}
setTimeout('updateProgressBar()', 5000);

调试控制台抱怨说：“未捕获：无法在初始化之前调用进度条上的方法：尝试调用方法‘值’” 谷歌在这里我发现问题可能与进度条的初始化有关after页面的加载

有人可以帮助我吗？

提前致谢

- 编辑 -

谢谢布莱恩，我正在尝试你的解决方案，但我不适合我

现在我有这个代码

function startProgress() {

    $(this).parent().append('<div class="progressbar"></div>');
    $(this).siblings('.progressbar').show();
    $(this).siblings('.progressbar').progressbar({value: 0});

    function updateProgress() {
        $('.progressbar').each(function() {
            myNewValue = getNewValue($(this).parent().parent().attr('id'));
            $(this).progressbar('value', myNewValue);
        });
        setTimeout('updateProgress', 5000);
    }
    setTimeout('updateProgress', 5000);
}

控制台说没有定义 updateProgress

- 编辑 -

非常感谢！！！

现在我有一个非常明确的版本可以工作......

这是我当前的代码

if($(this).siblings('.progressbar').size() == 0) {
        $(this).parent().append('<div class="progressbar"/>');
        $(this).siblings('.progressbar').progressbar({value: 0});
}
$(this).siblings('.progressbar').show();

function updateProgress() {
    $('.progressbar').each(function() {
        myParams = 'service=' + $(this).parent().parent().attr('id') + '&content=' + $(this).parent().attr('id')
        myUrl = '/datacast/content_progress/?' + myParams;
        theValue = $(this).progressbar('value');
        $.get(myUrl, {}, function(aReply) {
            myData = aReply.split(' ');
            myItemId =  myData[0];
            myValue = parseInt(myData[1]);
            try {
                $(".item[id = " + myItemId + "]").children(".progressbar").progressbar('value', myValue);
            }
            catch(myError) {
                //alert(myError);
            }
        })
    });
    setTimeout(updateProgress, 5000);
}
setTimeout(updateProgress, 5000);

正如您所看到的，当我多次传递该代码时，如果已经有进度条，我会添加一个控件。 进度条每次都会更新，但控制台抱怨说“TypeError：无法调用未定义的方法'apply'”，因此我必须添加带有空catch主体的try块来删除错误。该页面可以正常工作，但如果您知道为什么会出现该错误，那么它可能会很有趣

有同样的问题

显然你必须使用以下格式progressbar({value:30})第一次

如果你使用progressbar(value,30)第一次你会得到这个异常。