引导进度条程序运行时答案

【问题标题】：Bootstrap Progressbar Programmetic Runtime引导进度条程序运行时
【发布时间】：2017-02-23 22:21:32
【问题描述】：

我正在尝试在运行时添加默认引导进度条。设计时进度条很好，但是当我尝试使用 jquery 添加它运行时，进度不会显示。我需要能够在运行时动态添加这些进度条。

不确定我缺少什么，是否有 init 函数或我应该使用的东西？

这里有一个小提琴。 https://jsfiddle.net/riyasdeen/Lxovnbdj/

$(function() {
$('#prog_progress')
.append($($('<div>')
    .addClass('progress')
    .append($($('<div>')
        .addClass('progress-bar progress-bar-success progress-bar-striped')
        .attr('role','progressbar')
        .attr('aria-valuenow', '50')
        .attr('aria-valuemin', '0')
        .attr('aria-valuemax', '100')
        .css('width', '200px;')
        .append($($('<span>')
            .addClass('sr-only')
            .append('60%')
            ))
        ))
    ))

});

感谢您的宝贵时间。

【问题讨论】：

标签： javascript jquery css twitter-bootstrap progress-bar

【解决方案1】：

试试下面的代码

Jsfiddle

$(function() {
$('#prog_progress')
.append($($('<div>')
    .addClass('progress')
    .append($($('<div style="width:60%">')
        .addClass('progress-bar progress-bar-success progress-bar-striped')
        .attr('role','progressbar')
        .attr('aria-valuenow', '50')
        .attr('aria-valuemin', '0')
        .attr('aria-valuemax', '100')
        .css('width', '200px;')
        .append($($('<span>')
            .addClass('sr-only')
            .append('60%')
            ))
        ))
    ))
});

你错过了给它宽度。

【讨论】：