javascript - Bootstrap进度条起始值

标签 javascript jquery ruby-on-rails-3 progress-bar

我正在使用一个看起来非常好的引导进度条。我已经阅读了一些文档,如此处所示 https://github.com/minddust/bootstrap-progressbar .

我想知道是否有一种简单的方法来更改起始值(所以不是 0),就像我的应用程序每次所做的那样。我确实需要深入研究 javascript 和 jquery,但我还没有做到这一点。

所以我使用简单的方法:

          <div class="progress progress-striped active">
            <div class="progress-bar six-sec-ease-in-out" role="progressbar"  aria-valuetransitiongoal="33"></div>
          </div>

是我从 View 中控制,实际的JS来自这里

      $(window).ready(function(e){
              $.each($('div.progress-bar'),function(){
                $(this).css('width', $(this).attr('aria-valuetransitiongoal')+'%');
              });

目标是使用它作为进度条,我可以在每个 3 页添加起始值。第一页 0(默认值,因此无需更改),aria-valuetransitiongoal 为 33。第二页从 33% 开始,aria valuetransitiongoal 为 66% 等。到目前为止,我将目标设置为右侧值,但每次页面加载都会将该值重新重新设置为 0。

更新:本地存储是最好的方法吗...?

最佳答案

尝试设置“进度条”的宽度。

<div class="progress progress-striped active">
        <div class="progress-bar six-sec-ease-in-out" role="progressbar" style="width:33%"></div>
</div>

您还可以通过函数调用或变量动态设置宽度(返回“value%”,例如 20%)。

style="width:' + 变量/函数调用 + '"

关于javascript - Bootstrap进度条起始值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24300009/

相关文章:

javascript - jQuery 事件 currentTarget 数据集

jquery - 变量前面的$是什么意思

ruby-on-rails-3 - 用样本(假)数据填充数据库

ruby-on-rails - 如何在Mongoid中强制执行唯一的嵌入式文档

javascript - 添加并选择 "fake"<option> 值到 <select>

javascript - 使用 javascript 切换 CSS 类选择器

javascript - 如何在命令提示符下运行一个js文件

javascript - 如何停止选择文本?

javascript - CSS 导航链接样式 : remove styling of other element & remove double border when hovered on selected

ruby-on-rails - 在 Rails 3 中使用作用域