我需要使用jquery分别对列进行求和,并在新行的每列下面显示单个列和

时间:2017-11-07 07:36:37

标签: javascript jquery

这是我的HTML ...这是由我们用于编程的工具生成的。表类是mrquestiontable。在表格内,每个输入框都有类mredit。使用mredit我可以分别对所有框的总和而不是列的总和。请在这里帮忙..

<table summary="Please indicate the type of hospital/ clinic where you are 
currently practicing and the proportion of time spent in each practice." 
class="mrQuestionTable">
<tr><td></td>
<td><span><center><b>Main Practice</b></center></span></td>
<td><span><center><b>Secondary Practice</b></center></span></td>
</tr>
<tr>
<td><span class="mrQuestionText">Public Hospital</span></td>
<td><span><input type="text" class="mrEdit" value=""/></span></td>
<td><span><input type="text" class="mrEdit" value=""/></span></td>
</tr>
<tr>
<td><span class="mrQuestionText">Private Hospital</span></td>
<td><span><input type="text" class="mrEdit" value=""/></span></td>
<td><span><input type="text" class="mrEdit" value=""/></span></td>
</tr>
</table>

2 个答案:

答案 0 :(得分:0)

要计算列,首先需要将类添加到所需的列/行。

<td class="calculate_R"><span><input type="text" class="mrEdit" value=""/></span></td>

至于jquery,它可能是这样的,

var total = 0;
// iterate through each td based on class
$(".calculate_R").each(function() {

    var value = $(this).text();
    //only if the value is a number
    if(!isNaN(value) && value.length != 0) {
        total += parseFloat(value);
    }
});

然后将其全部包装在一个函数中。

 function calculate_total() {
   //above code
 }

使用$(calculate_total);

进行调用

答案 1 :(得分:0)

我写了一些可能适合您需求的东西。它会自动添加一行以显示表格下方的添加值。当您在输入中编辑某些内容时,它将计算列总数并将其放入表格下方的标签中。

&#13;
&#13;
function setup() {
  $('.mrQuestionTable').append('<tr><td></td><td><label></label></td><td><label></label></td><tr>');
}

setup();

$('input').blur(function(e) {
  var index = $(this).parent().parent().index();
  var elements = $('.mrQuestionTable td:nth-child(' + (index + 1) + ')'); //Skipping the first column
  var label = elements.find('label');
  var inputs = elements.find('input');
  var count = 0;
  label.text('');
  inputs.each(function(e) {
    value = parseInt($(this).val());
    if (value) {
      count += value;
    }
    label.text(count);
  });
});
&#13;
<table summary="Please indicate the type of hospital/ clinic where you are 
currently practicing and the proportion of time spent in each practice." class="mrQuestionTable">
  <tr>
    <td></td>
    <td><span><center><b>Main Practice</b></center></span></td>
    <td><span><center><b>Secondary Practice</b></center></span></td>
  </tr>
  <tr>
    <td><span class="mrQuestionText">Public Hospital</span></td>
    <td><span><input type="text" class="mrEdit" value=""/></span></td>
    <td><span><input type="text" class="mrEdit" value=""/></span></td>
  </tr>
  <tr>
    <td><span class="mrQuestionText">Private Hospital</span></td>
    <td><span><input type="text" class="mrEdit" value=""/></span></td>
    <td><span><input type="text" class="mrEdit" value=""/></span></td>
  </tr>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
&#13;
&#13;
&#13;