table中数据显示NaN问题。

最新推荐文章于 2024-08-13 16:52:45 发布

小小芽儿

最新推荐文章于 2024-08-13 16:52:45 发布

阅读量9.8k

点赞数

本文链接：https://blog.youkuaiyun.com/qq_24606505/article/details/58596456

版权

博客内容讲述了在HTML table中由于嵌套div导致数据显示为NaN的问题，原因是div为空，JavaScript无法正确获取值。解决方法是在table的tr元素中添加class，以确保正确地获取和展示数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

主要问题在于之前在table中嵌套了个div，以至于查看源码div为空，js取不到值问题。

解决方法：在table中的tr中设置class。

<table border="1">
					<tr>
					    <td>材料名称</td>
					    <td>材料类型</td>
					    <td>施工面积</td>
					    <td>规格</td>
					    <td>涂布量</td>
					    <td>出货量</td>
					    <td>合约供货价</td>
					    <td>合约供货金额</td>
					    <td>申请特价</td>
					    <td>特价供货金额</td>
	  				</tr>
					<c:forEach items="${ps}" var="p">
						<tr class="bucket">
						    <td>${p.productName}</td>
						    <td>${p.type}(${p.specialEvent})</td>
						    <td>${p.area}㎡</td>
						    <td>${p.specifications}kg/桶</td>
						    <td><c:if test="${p.coatingType ne '默认'}">(${p.coatingType})</c:if>
								${p.coating}kg/㎡</td>
						    <td><font id="shipment">${p.shipment}</font>kg
								<font id="tin">${p.tin}</font>桶</td>
						    <td>${p.cprice}元/kg/${p.ctinWeight}元/桶</td>
						    <td><font id="cmoney">${p.cmoney}</font>元</td>
						    <td>${p.sprice}元/kg/${p.stinWeight}元/桶</td>
						    <td id="last"><font id="smoney">${p.smoney}</font>元</td>
		  				</tr>
					</c:forEach>
					<tr>
					    <td colspan="10"><label class="label">
						<span class="need">*</span>配套统计：
					</label>
					出货量小计：<font id="shipmentSub" class="shipmentSub" color="red">0</font>kg　　<font id="tinSub" class="tinSub" color="red">0</font>桶
					----合约供货金额小计： <font id="cmoneySub" class="cmoneySub" color="red">0</font>元
					----特价供货金额小计： <font id="smoneySub" class="smoneySub" color="red">0</font>元
					</td>
					</tr>
				</table>


function caculSub(obj){//该obj 为一个产品配套
		var shipmentSub=0;
		var tinSub=0;
		var cmoneySub=0;
		var smoneySub=0;
		$(".bucket",obj).each(function(i){
			shipmentSub+=parseFloat($("#shipment",$(this)).text());
			tinSub+=parseFloat($("#tin",$(this)).text());
			cmoneySub+=parseFloat($("#cmoney",$(this)).text());
			smoneySub+=parseFloat($("#smoney",$(this)).text());
		})
		$("#shipmentSub",obj).text(Math.round(shipmentSub*100)/100);
		$("#tinSub",obj).text(Math.round(tinSub*100)/100);
		$("#cmoneySub",obj).text(Math.round(cmoneySub*100)/100);
		$("#smoneySub",obj).text(Math.round(smoneySub*100)/100);
		caculTotal();
	}