Question

我在表格的第三列中有进度条。并且我从我评论使用的td替换progressbar的值，并且从我评论的td中获取最大进度条。

问题是代码是当有两个进度条我的代码无法正常工作时已经显示一个值。

我该怎么办？

这是我的代码：

$("table tr").each(function() {
  var progress = $(this).find('td:eq(2) progress');
  progress.val($(this).find('td:eq(1)').text())
  progress.prop('max', $(this).find('td:eq(0)').text())
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr>
<td>30</td> <!--available-->
<td>4</td> <!--used-->
<td colspan="2"> <progress value="98" max="100"><div class="graph"></div></progress></td>
</tr>

<tr>
<td>20 <br/> 20</td> <!--available-->
<td>6  <br/> 5</td>  <!--used-->
<td>
<progress value="50" max="100"><div class="graph"></div></progress><br/>
 <progress value="50" max="100"><div class="graph"></div></progress>
</td>
</tr>
</table>

Answer 1

你可以这样做：

＆＃13;

componentDidMount

＆＃13;

$("table tr").each(function() {
  var children = $(this).children('td');    //get all td children of current tr
  var vals = $(children[1]).html().split('<br>');   //get an array of values by splitting on <br>
  var maxVals = $(children[0]).html().split('<br>');   //likewise get an array of max values by splitting on <br>
  var progressBars = $(this).find('progress');    // find all progress elements inside current tr.
  vals.forEach((val, index) => {     //iterate over vals array
      $(progressBars[index]).val(parseInt(val));     //use index to set val for correct progressBar
      $(progressBars[index]).prop('max', parseInt(maxVals[index]));
  })
});

＆＃13;

如何将表td文本添加到进度值中

1 个答案: