获取特定列中的值(Numbers)

时间:2018-06-05 11:27:32

标签: javascript jquery html

我正在尝试使jquery总计特定列中的所有数字并将其输出到html中。继承人的代码

var vals = new Array(), i = 0, price = 0;
$("#TextBookTB tr:gt(0) td:nth-child(5)").each(function(){
  if($.inArray(i, vals) < 0)
  {
    if($.isNumeric(vals[i]))
    {
      price = price + vals[i];
      console.log(vals[i]);
      i++;
    }
  }
});
$("#ES3P").text(price);

干杯!

编辑:表格按要求。该表由PHP回应。不太确定为什么它不能正常工作,因为我希望它应该

echo '<div class="container-fluid MainContent">
  <div id="TBForm" class="container-fluid MainContentF">
    <table id="TextBookTB" class="table table-dark table-bordered">
        <thead>
          <tr>
            <th scope="col">A</th>
            <th scope="col">B</th>
            <th scope="col">C</th>
            <th scope="col">D</th>
            <th scope="col">E</th>
            <th scope="col">F</th>
            <th scope="col">G</th>
            <th scope="col">H</th>
          </tr>
        </thead>
        <tbody>
'; 
LoadBooks();
echo '  </tbody>

      </table>
      <br>
      <div class="row">
        <form id="ES3S" action="enroll.php" method="post">
          <input type="hidden" name="Enrollment" value="Textbooks">
          <button type="submit" class="btn btn-primary">Next Step</button>
        </form>
      </div>
    </div>
    </div>
';

3 个答案:

答案 0 :(得分:1)

&#13;
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container-fluid MainContent">
	<div id="TBForm" class="container-fluid MainContentF">
		<table id="TextBookTB" class="table table-dark table-bordered">
			<thead>
				<tr>
					<th scope="col">A</th>
					<th scope="col">B</th>
					<th scope="col">C</th>
					<th scope="col">D</th>
					<th scope="col">E</th>
					<th scope="col">F</th>
					<th scope="col">G</th>
					<th scope="col">H</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>A</td>
					<td>B</td>
					<td>C</td>
					<td>D</td>
					<td>1</td>
					<td>F</td>
					<td>G</td>
					<td>H <input type="radio" value="test" onchange="fCalcPrice()"/></td>
				</tr>
				<tr>
					<td>A</td>
					<td>B</td>
					<td>C</td>
					<td>D</td>
					<td>2</td>
					<td>F</td>
					<td>G</td>
					<td>H <input type="radio" value="test" onchange="fCalcPrice()"/></td>
				</tr>
				<tr>
					<td>A</td>
					<td>B</td>
					<td>C</td>
					<td>D</td>
					<td>3</td>
					<td>F</td>
					<td>G</td>
					<td>H <input type="radio" value="test" onchange="fCalcPrice()"/></td>
				</tr>
			</tbody>
		</table>
	</div>
</div>
<div id="ES3P"></div>
&#13;
{{1}}
&#13;
&#13;
&#13;

Jaromanda X的片段似乎对我使用jQuery的每个函数都很好,但只有在将$(td)更改为$(this)时,才会包含一个runnable片段。

编辑:更新为仅向包含按钮的总计添加行 编辑#2:更新为仅添加包含勾选的无线电框的行

答案 1 :(得分:0)

我想你想要像

这样的东西
CONCAT()

答案 2 :(得分:0)

将您的代码放入document.ready中,如下所示:

$(document).ready(function() {
 var price = 0;
 $("#TextBookTB tr:gt(0) td:nth-child(5)").each(function(td){
   var content = $(td).text();
   if($.isNumeric(content)) {
     price = price + Number(content);
    }
   });
   $("#ES3P").text(price);
})