对不起,如果这有点令人困惑,但我会尽力解释我想做的事。
我有一个包含3行和5列的表格。第4列有一个名称-td name =“csl1” - 对于第1行,-td name =“csl2” - 对于第2行,-td name =“csl3” - 对于第3行。第5列有一个名称-td name =“nsl1” - 对于第1行,-td name =“nsl2” - 对于第2行,-td name =“nsl3” - 对于第3行。
我正在尝试使用Jquery遍历名称,以便在单击按钮时获取其值...
$('#purcbutton').click(function(e){
for(i = 1; i <4; i++){
var csl = $("td[name=csl"+i"]").val();
var nsl = $("td[name=nsl"+i"]").val();
var total = parseInt(csl+nsl);
$("td[name=csl"+i"]").val(price);
}
})
问题是这些部分“td [name = csl”+ i“]”似乎是错误的,我显然不允许把'i'放在中间。我对JQuery很新,不知道该怎么做。如果您需要更多信息,请询问。
- - - - - - - - HTML
<form id="staffjobs" >
<table id="stocktable" >
<tr id="about" style="height: 35px;">
<td style="border-bottom: groove; text-align: center; width: 100px;">PLU Code</td>
<td style="border-bottom: groove; text-align: center; width: 100px;">Product Name</td>
<td style="border-bottom: groove; text-align: center; width: 100px;">Price</td>
<td style="border-bottom: groove; text-align: center; width: 100px;">Current Stock Level</td>
<td style="border-bottom: groove; text-align: center; width: 100px;">New Stock Level</td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="14322" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="GreenB - Ivory White" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$1989.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl1" ><input value="12" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl1" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="14323" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="GreenB - Carbon Black" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$1989.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="4" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t2" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="34534" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Light Weight Aluminium" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$799.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl2" ><input value="11" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl2" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t3" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="34535" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="High-tech carbon fiber" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$1199.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl3" ><input value="3" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl3" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="63561" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Everyday" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$399.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="16" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="63562" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Endurance" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$729.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="10" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="63563" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Off Road" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$989.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="5" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="77885" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Standard V-Brake" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$34.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="18" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="77886" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Advanced V-Brake" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$59.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="13" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="77887" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Disc Brake" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$119.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="1" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="65532" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Nimh Battery Pack" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$479.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="27" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="65533" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Li-ion Battery Pack " type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$799.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="19" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="99853" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Wing Base Bar" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$269.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="5" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="99854" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="K-Wing Handlebar" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$399.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="7" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="99855" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Aeria T2" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$949.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="3" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="43446" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Basket" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$39.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="13" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="43447" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Tail Light" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$24.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="51" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="43448" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Bell" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$25.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="44" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</tr>
<tr id="about" name="t1" style="height: 35px;">
<td style="border-bottom: inset; text-align: center" name="plu" ><input value="43449" type="textbox" id="c1" style="height: 18px; width: 50px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="pname" ><input value="Heavy Duty Lock" type="textbox" id="c2" style="height: 18px; width: 160px; "></td>
<td style="border-bottom: inset; text-align: center" name="price" ><input value="$34.99" type="textbox" id="c3" style="height: 18px; width: 70px; text-align: right;"></td>
<td style="border-bottom: inset; text-align: center" name="csl" ><input value="32" type="number" id="c4" style="height: 18px; width: 40px; text-align: right;" readonly="true"></td>
<td style="border-bottom: inset; text-align: center" name="nsl" ><input type="number" id="c5" style="height: 18px; width: 40px; text-align: right;"></td>
</table>
<p id="updatepos" style="top: 1000px;"><button id="purcbutton" type="button" title="Select a checkbox to update and remove" style="width: 70px; height: 30px; padding-top: 7px;">
<p id="purcbuttonsty" style="font-family: Source Sans Pro; font-size: 14px;">Update</button></p></p>
<script>
$('#purcbutton').click(function(e){
var csl,nsl,total;
$('tr').each(function(){
csl=$(this).children('td').eq(3).text();
nsl=$(this).children('td').eq(4).text();
total = parseInt(csl+nsl);
$(this).children('td').eq(4).text(total);
});
});
</script>
</form><br><br>
答案 0 :(得分:1)
我认为最好的方法是使用each()
功能,这样您就不需要命名tds或trs:
$('#purcbutton').click(function(e){
var csl,nsl,total;
$('tr').each(function(){
csl=$(this).children('td').eq(3).children('input').val(); //the fourth column value
nsl=$(this).children('td').eq(4).children('input').val(); //the fifth column value
total = parseInt(csl+nsl);
$(this).children('td').eq(4).children('input').val(total); //I think you meant "total" by "price" because I don't see any variable called "price"
});
});
答案 1 :(得分:0)
问题出在jquery,&#34; 2&#34; +&#34; 3&#34; =&#34; 23&#34;。
你被接受的结果是5为该parsefloat(&#34; 2&#34;)+ parsefloat(&#34; 3&#34;)= 5
$('#purcbutton').click(function(e){
for(i = 1; i <4; i++){
var csl = parseFloat($("td[name=csl"+i"]").text());
var nsl =parseFloat $("td[name=nsl"+i"]").text());
var total =parsecsl+nsl);
$("td[name=csl"+i"]").text(price);
}
})