获取特定列中的值(数字)

Question

我正在尝试使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>
';

Answer 1

function fCalcPrice()
{
var price = 0;
$("#TextBookTB tr:gt(0)").each(function(){
var radio = $(this).find("input[type='radio']");
if(radio.is(":checked"))
{
var content = $(this).children().eq(4).text();
console.log(content);
if($.isNumeric(content)) {
price = price + Number(content);
}
}
});
$("#ES3P").text(price);
}
fCalcPrice();

<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>

Jaromanda X 的代码片段似乎对我来说使用 jQuery 每个函数工作正常，但只有在将 $(td( 更改为 $(this( 时，才包含一个可运行的片段。

编辑：更新为仅将行添加到包含按钮的总数中 编辑#2：更新为仅添加包含选中单选框的行

Answer 2

我想你想要类似的东西

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);

Answer 3

把你的代码放在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);
})