Javascript 计算最后一列单元格的值——涉及动态表行
考虑以下HTML表：Javascript 计算最后一列单元格的值——涉及动态表行,javascript,jquery,jquery-plugins,jquery-selectors,Javascript,Jquery,Jquery Plugins,Jquery Selectors,考虑以下HTML表： <table id="myTable1"> <tr id="TR1"> <td><input type="text" id="quantity1" name="quantity1" /></td> <td><input type="text" id="weight1" name="weight1" /></td> <t
<table id="myTable1">
<tr id="TR1">
<td><input type="text" id="quantity1" name="quantity1" /></td>
<td><input type="text" id="weight1" name="weight1" /></td>
<td><input type="text" id="sub_total1" name="sub_total1" /></td>
</tr>
</table>
$(document).ready(function() {
var counter = 2;
$("#addButton").click(function() {
$('#myTable1 tr:last').after(
'<tr id="TR"><td><input type="text" name="quantity' + counter +
'" id="quantity' + counter + '" value=""></input></td>' +
'<td><input type="text" name="weight' + counter +
'" id="weight' + counter + '" value=""></input></td>' +
'<td><input type="text" name="sub_total' + counter +
'" id="sub_total' + counter + '" value=""></input></td></tr>'
);
counter++;
});
});
var sub_total = ((170 * 10) + (70 * 5)) * (10);
我有以下内容作为开始，但“不太确定在这些函数中放置什么”
$('#myTable1 input[id^=\'quantity\'], #myTable1 input[id^=\'weight\']').live('keyup',function() {
$('#myTable1 input[id^=\'quantity\'], #myTable1 input[id^=\'weight\']').each(function(index, value) {
});
});
var输入\u cols=$(
'' +
'' +
''
).find（'input[name=quantity]，input[name=weight]'）.keyup（function（）{updateTotal（this）；}）；
$（'myTable1 tr:last'）。在（input#cols）之后；
函数updateTotal（el）{
el=el.最近（'tr'）；
weight=el.find（'input[name=weight]'）.val（）；
quantity=el.find（'input[name=quantity]'）.val（）；
el.find（'input[name=sub_total]'）.val（quantiy*weight….将公式放在这里）；
}
数量重量小计$("#myTable1 [id^=quantity], #myTable1 [id^=weight]").live("keyup", function() {
var $tr = $(this).closest("tr");
var quantity = parseInt($("[id^=quantity]", $tr).val());
var weight = parseInt($("[id^=weight]", $tr).val());
var firstTen;
if (weight <= 10) {
firstTen = weight;
weight = 0;
} else {
firstTen = 10;
weight -= 10;
}
$("[id^=sub_total]", $tr).val((170 * firstTen + 70 * weight) * quantity);
});
$（“#myTable1[id^=quantity]，#myTable1[id^=weight]”）.live（“keyup”，function（）{
var$tr=$（此）.tr；
var quantity=parseInt（$（“[id^=quantity]”，$tr.val（））；
var-weight=parseInt（$（“[id^=weight]”，$tr.val（））；
var Firsten；
if（weight如果您的问题是：动态字段没有发生任何事情，那么很明显keyup事件没有绑定
使用.Bind（）绑定事件，或在动态生成的代码中调用to do on键。为不同的输入字段指定不同的类名，例如数量重量
小计
试试这个
$("#addButton").click(function() {
$('#myTable1 tr:last').after(
'<tr id="TR' + counter +'"><td><input type="text" class="quantity" name="quantity' + counter +
'" id="quantity' + counter + '" value=""></input></td>' +
'<td><input type="text" class="weight" name="weight' + counter +
'" id="weight' + counter + '" value=""></input></td>' +
'<td><input type="text" class="sub_total" name="sub_total' + counter +
'" id="sub_total' + counter + '" value=""></input></td></tr>'
);
counter++;
$('tr').each(function(){
var qnty = 0
var weight = 0;
$('input.quantity', $(this)).keyup(function(){
qnty = Number($(this).val());
if(qnty != 0 && weight != 0){
newRowCalculation($(this).parent().parent('tr'), qnty, weight);
}
});
$('input.weight', $(this)).keyup(function(){
weight = Number($(this).val());
if(qnty != 0 && weight != 0){
newRowCalculation($(this).parent().parent('tr'), qnty, weight);
}
});
});
function newRowCalculation(elem, qnty, weight){
if(weight > 10){
var extraWeight = Number(weight - 10);
var subTotal = (170 * 10 + 70 * extraWeight) * qnty;
$('.sub_total', $(elem)).val(subTotal);
}
else{
var subTotal = (170 * weight) * qnty;
$('.sub_total', $(elem)).val(subTotal);
}
}
$（“#添加按钮”）。单击（函数（）{
$（'myTable1 tr:last'）。之后(
'' +
'' +
''
);
计数器++；
$（'tr'）。每个（函数（）{
var qnty=0
变量权重=0；
$（'input.quantity'，$（this））.keyup（function（）{
qnty=数字（$（this.val（））；
如果（qnty！=0和重量！=0）{
newRowCalculation（$（this）.parent（）.parent（'tr'），qnty，weight）；
}
});
$（'input.weight'，$（this））.keyup（function（）{
权重=数字（$（this）.val（））；
如果（qnty！=0和重量！=0）{
newRowCalculation（$（this）.parent（）.parent（'tr'），qnty，weight）；
}
});
});
函数newrow计算（元素、数量、重量）{
如果（重量>10）{
var额外重量=数量（重量-10）；
var小计=（170*10+70*extraWeight）*qnty；
$（'sub_total'，$（elem））.val（小计）；
}
否则{
var小计=（170*权重）*qnty；
$（'sub_total'，$（elem））.val（小计）；
}
}
感谢Frédéric您提供的解决方案奏效了！在此之前，我不熟悉Nestest（）——现在，我的jQuery工具箱中又增加了一个函数！
$("#myTable1 [id^=quantity], #myTable1 [id^=weight]").live("keyup", function() {
var $tr = $(this).closest("tr");
var quantity = parseInt($("[id^=quantity]", $tr).val());
var weight = parseInt($("[id^=weight]", $tr).val());
var firstTen;
if (weight <= 10) {
firstTen = weight;
weight = 0;
} else {
firstTen = 10;
weight -= 10;
}
$("[id^=sub_total]", $tr).val((170 * firstTen + 70 * weight) * quantity);
});
$("#addButton").click(function() {
$('#myTable1 tr:last').after(
'<tr id="TR' + counter +'"><td><input type="text" class="quantity" name="quantity' + counter +
'" id="quantity' + counter + '" value=""></input></td>' +
'<td><input type="text" class="weight" name="weight' + counter +
'" id="weight' + counter + '" value=""></input></td>' +
'<td><input type="text" class="sub_total" name="sub_total' + counter +
'" id="sub_total' + counter + '" value=""></input></td></tr>'
);
counter++;
$('tr').each(function(){
var qnty = 0
var weight = 0;
$('input.quantity', $(this)).keyup(function(){
qnty = Number($(this).val());
if(qnty != 0 && weight != 0){
newRowCalculation($(this).parent().parent('tr'), qnty, weight);
}
});
$('input.weight', $(this)).keyup(function(){
weight = Number($(this).val());
if(qnty != 0 && weight != 0){
newRowCalculation($(this).parent().parent('tr'), qnty, weight);
}
});
});
function newRowCalculation(elem, qnty, weight){
if(weight > 10){
var extraWeight = Number(weight - 10);
var subTotal = (170 * 10 + 70 * extraWeight) * qnty;
$('.sub_total', $(elem)).val(subTotal);
}
else{
var subTotal = (170 * weight) * qnty;
$('.sub_total', $(elem)).val(subTotal);
}
}