<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<!-- Quantity Fields -->
<label for="quantity1">Quantity 1:</label>
<input type="number" id="quantity1" value="0">
<br>
<label for="quantity2">Quantity 2:</label>
<input type="number" id="quantity2" value="0">
<br>
<!-- Display Total -->
<p>Total: $<span id="total">0.00</span></p>
<script>
// Function to update the total based on quantity fields
function updateTotal() {
// Get the values of quantity fields
var quantity1 = parseInt($('#quantity1').val());
var quantity2 = parseInt($('#quantity2').val());
// Calculate the total based on your pricing logic
var total = (quantity1 * 10) + (quantity2 * 15); // Adjust pricing as needed
// Update the total display
$('#total').text(total.toFixed(2));
}
// Attach change event listeners to quantity fields
$('#quantity1, #quantity2').on('change', function() {
updateTotal();
});
// Initial total update
updateTotal();
</script>
</body>
</html>
1条答案
按热度按时间nwwlzxa71#
您可以使用JavaScript（包括jQuery）来监听数量字段中的变化，并相应地计算总数。下面是一个示例代码：