大家好,我已经在Google上试了好几天了,无法弄清楚如何使此代码仅计算出addrow和deleterow函数起作用的数量列,只是可以弄清楚由谁来获得此toi calculatre总量如果尝试使用不同的代码但没有成功,请在金额列上提供帮助
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(document).on('click', '#ncItems.add', function() {
var row = $(this).parents('tr');
var clone = row.clone();
// clear the values
var tr = clone.closest('tr');
tr.find('input[type=text]').val('');
$(this).closest('tr').after(clone);
var total = 0;
$(".last").each(function() {
if (!$(this).val() == '') {
total = total + parseFloat($(this).val());
}
})
$("#nctotalPrice").html("$" + total +".00");
});
$(document).on("blur", ".last", function() {
var total = 0;
$(".last").each(function() {
if (!$(this).val() == '') {
total = total + parseFloat($(this).val());
}
})
$("#nctotalPrice").html("$" +total+".00");
document.getElementById("ntotal").value ="$" +total+".00";
});
$(document).on('focus', ".last", function() {
var $qty = $(this).parents("tr").find("input[name^='quantity']");
var $pr = $(this).parents("tr").find("input[name^='price']");
var $amnt = $(this).parents("tr").find("input[name^='amount']");
var a = 0;
if ($qty.val() == '' || $pr.val() == '') {
console.log("No values found.");
return false;
} else {
console.log("Converting: ", $qty.val(), $pr.val());
var q = parseInt($qty.val());
var p = parseFloat($pr.val());
console.log("Values found: ", q, p);
}
a = q * p;
$amnt.val(Math.round(a * 100) / 100);
});
$(document).on('click', 'ncItems .removeRow', function() {
if ($('#ncItems .add').length > 1) {
$(this).closest('tr').remove();
}
});
});
</script>
<div id="dvncc">
<form id="ncc">
<table id="ncItems" name="ncItems" align="center">
<tr>
<th>Type</th>
<th>Discription</th>
<th>Amount</th>
<th>Actions</th>
</tr>
<tr>
<td>
<select name="type[]" class="next" required>
<option value=" selected="selected"">Please Select..</option>
<option value="Code">Code</option>
<option value="Regular">Regular</option>
</select>
</td>
<input type="text" name="discription[]" class="next" required />
</td>
<td>
<input type="text" name="amount[]" class="next last" required readonly/>
</td>
<td>
<input type="button" name="addRow[]" class="add" value='+' />
<input type="button" name="addRow[]" class="removeRow" value='-' />
</td>
</tr>
<tr>
<th>Total :</th>
<td id="nctotalPrice"></td>
</tr>
</table>
</form>
</div>
答案 0 :(得分:0)
请尝试以下操作:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Final</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(document).on('click', '.add', function() {
var row = $(this).parents('tr');
var clone = row.clone();
// clear the values
var tr = clone.closest('tr');
tr.find('input[type=text]').val('');
$(this).closest('tr').after(clone);
var total = 0;
$(".last").each(function() {
if (!$(this).val() == '') {
total = total + parseFloat($(this).val());
}
})
$("#nctotalPrice").html("$" + total +".00");
});
$(document).on("blur", ".last", function() {
var total = 0;
$(".last").each(function() {
if (!$(this).val() == '') {
total = total + parseFloat($(this).val());
}
})
$("#nctotalPrice").html("$" +total+".00");
document.getElementById("ntotal").value ="$" +total+".00";
});
$(document).on('focus', ".last", function() {
var $qty = $(this).parents("tr").find("input[name^='quantity']");
var $pr = $(this).parents("tr").find("input[name^='price']");
var $amnt = $(this).parents("tr").find("input[name^='amount']");
var a = 0;
if ($qty.val() == '' || $pr.val() == '') {
console.log("No values found.");
return false;
} else {
console.log("Converting: ", $qty.val(), $pr.val());
var q = parseInt($qty.val());
var p = parseFloat($pr.val());
console.log("Values found: ", q, p);
}
a = q * p;
$amnt.val(Math.round(a * 100) / 100);
});
$(document).on('click', '.removeRow', function() {
if ($('#ncItems .add').length > 1) {
$(this).closest('tr').remove();
}
});
});
</script>
</head>
<body>
<div id="dvncc">
<form id="ncc">
<table id="ncItems" name="ncItems" align="center">
<tr>
<th>Type</th>
<th>Discription</th>
<th>Amount</th>
<th>Actions</th>
</tr>
<tr>
<td>
<select name="type" class="next" required>
<option value="" selected="selected">Please Select..</option>
<option value="Code">Code</option>
<option value="Regular">Regular</option>
</select>
</td>
<td>
<input type="text" name="discription" class="next" required />
</td>
<td>
<input type="text" name="amount" class="next last" required/>
</td>
<td>
<input type="button" name="addRow" class="add" value='+' />
<input type="button" name="remove" class="removeRow" value='-' />
</td>
</tr>
<tr>
<th>Total :</th>
<td id="nctotalPrice"></td>
</tr>
</table>
</form>
</div>
</body>
</html>