筛选多行并使用类计算行以更改进度条

Filtering mutiple rows and counting rows with class to change progress bar

本文关键字：筛选 计算      更新时间：2023-09-26

嗨，伙计们，我一直在一个项目上工作，一路上学习了一些Bootstrap，但我现在真的需要你们的帮助。对于jquery，我完全是一个新手所以我就直接使用它:

My Fiddle will Explain all

    第一个问题是进度条，我需要它是动态的已经把桌子摆好了，那么当标记完一行会怎么样呢get class of:"成功"我要做的就是取得进步酒吧计数行与类"成功"，并显示到目前为止的进展如果10行中有4行成功，那么进度条应该是成功的读40%。

我的进度条现在是这样的:

<div class="progress">
   <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="70"    aria-valuemin="0" aria-valuemax="100" style="width:70%">70%</div>
</div>
  • 我需要能够将过滤器应用到表格中，但我也应该能够一次应用多个过滤器:例如，可以看到"区域a"中的所有"支线任务"，但只能看到"1 - 10级"之间的"未完成"任务

    • 我已经为每个过滤器菜单设置了类，以及一些带有data- attribute的菜单。

    任何帮助都会很棒!

    编辑:这是问题中第1点(进度条)的解决方案。

    下面的javascript完成进度条的工作，Demo在这里

    你应该在html

    中以0开始进度条
    var successRows = $(this).parents("tbody").children(".success").length;
var totalRows = $(this).parents("tbody").children("tr").length;
var progressPerc = ((successRows / totalRows) * 100) + "%";
$(".progress-bar").width(progressPerc).text(progressPerc);
    相关文章：