选择表格行列问题
来源:1-9 位置与表单选择器
niuhuiyang
2020-03-14 15:43:20
老师我想通过遍历表单的第6列来获取数值从而进行加法运算,但最后显示的是无定义,不过后台没有报错麻烦老师看看是什么问题
以下是该页面表格这一块的代码
<form class="form-horizontal"
action="${pageContext.request.contextPath}/AddCartServlet"
enctype="multipart/form-data" onsubmit="return totalPrice()"
method="post">
<div class="table-content table-responsive">
<table class="myTable">
<thead>
<tr>
<th class="indecor-product-remove">remove</th>
<th class="indecor-product-thumbnail">images</th>
<th class="cart-product-name">Product</th>
<th class="indecor-product-price">Unit Price</th>
<th class="indecor-product-quantity">Quantity</th>
<th class="indecor-product-subtotal">Total</th>
</tr>
</thead>
<tbody>
<c:forEach items="${sessionScope.cartList }" var="cl">
<tr>
<td class="indecor-product-remove"><a
href="${pageContext.request.contextPath}/DeleteCartServlet?productId=${cl.productId}"><i
class="fa fa-times"></i></a></td>
<td class="indecor-product-thumbnail"><a href="#"><img
src="${cl.productPicture }" width="100px" height="100px"></a></td>
<td class="indecor-product-name"><a href="#">${cl.productName}</a></td>
<td class="indecor-product-price"><span class="amount">$${cl.productPrice}</span></td>
<td class="indecor-product-quantity">
<span>${cl.productAmount }</span>
<!-- <input value="1" name="Cartquantity" class="Cartquantity" type="text"> -->
<a class="view"
href="${pageContext.request.contextPath}/UpdateAmountJumpServlet?productId=${cl.productId}">修改数量</a></td>
<td class="product-subtotal" onsubmit="return money()"><span
id="TotalPrice" class="TotalPrice">${cl.productPrice*cl.productAmount }</span></td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
<div class="row">
<div class="col-12">
<div class="coupon-all">
<div class="coupon">
<input id="coupon_code" class="input-text" name="coupon_code"
value="" placeholder="Coupon code" type="text"> <input
class="button" name="apply_coupon" value="Apply coupon"
type="submit">
</div>
<div class="coupon2">
<input class="button" name="update_cart" value="Update cart"
type="submit">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-5 ml-auto">
<div class="cart-page-total">
<h2>Cart totals</h2>
<ul>
<li>Total <span>$130.00</span></li>
</ul>
<!-- bbutton最好用class -->
<button class="updateCart" type="button">Update Price</button>
<!-- <button id="updateCart" type="button">Update Price</button> -->
<a href="#">Proceed to checkout</a>
</div>
</div>
</div>
</form>
下面是点击Update Price后的代码:
<script type="text/javascript">
$(".updateCart").click(function(){
alert("一点击");
alert($(".myTable tr").eq(1).find("td:eq[6]").val());
// alert($(".myTable").rows.length);
var sum = 0;
for (var i = 1; i <= $(".myTable").find("tr").length; i++) {
sum += parseFloat($(".myTable").find("tr:eq[i]").find("td:eq[6]").innerText)
}
alert(sum);
});
</script>
4回答
同学你好
同学的代码中,i被当成字符串了,没有识别为数字,
所以 alert一下 parseFloat($("table tr:eq(i) td:eq(5)").text())可以发现是NaN。
这里我们应该拼一下,如下图所示:
如果我的回答解决了你的问题,请采纳,祝学习愉快.
niuhuiyang
提问者
2020-03-14
老师,可以了,可以显示指定列的数字,但是现在相加出了问题
显示的是NaN,麻烦老师看看是什么问题
<script type="text/javascript">
$(".updateCart").click(function(){
alert("一点击");
alert($("table tr:eq(1) td:eq(5)").text());
alert($("table").find("tr").length);
var sum = 0;
for (var i = 1; i < $("table").find("tr").length; i++) {
sum += parseFloat($("table tr:eq(i) td:eq(5)").text())
}
alert(sum);
});
}
这是最后修改后的代码
niuhuiyang
提问者
2020-03-14
列数改为5也不行,还是无定义
niuhuiyang
提问者
2020-03-14
即使第6列显示数据也不行的
相似问题