jQuery檢查輸入的增加/減少值

Question

我正在從事這個電子商務項目，如果選中了特定的復選框，則需要計算“運輸成本”。 這是復選框的代碼：-

<div class="alert alert-info">
<p>Shipping Outside Lagos (N2, 000)</p>
<input type="checkbox" name="shipping" id="shipping">
</div>

如何編寫jQuery函數，以便在檢查輸入時..我可以在變量中獲取值。 假設默認值為2000，我將如何獲得$ amount = 2000（如果選中），而如果未選中，則$ amount仍為0。 由於我對jQuery / JavaScript的了解有限，因此無法找到解決方案。 搜索也沒有幫助。

歡迎任何建議。

Answer 1

var amount = $('#shipping').is(':checked') ? 2000 : 0;

$('#shipping').on('change', function() {
     amount = this.checked ? 2000 : 0;
});

// use amount

Answer 2

你可以做：

var shippingAmt = 0;
$("#shipping").change(function() {
    shippingAmt = this.checked ? 2000 : 0;
});

Answer 3

我建議使用一個函數來確定項目的成本。 您可以具有確定成本的摘要，可以說要花費幾個或幾個條件才能計算出“附加值”。

因此，您的初始總計為$ 500.99，然后通過諸如calculateTotalValue(value)類的值運行該值

它將檢查是否在表單中檢查了任何附加組件，並將其值添加到初始值。

這樣一來，您可以擁有任意數量的附加產品，例如運輸，甚至產品本身的附加組件/升級產品，而且每種情況下您都可以輕松獲取總數。 您可能有一種通用的方式來規定字段是“附加項”，因此您無需維護列表，例如：

<input type="checkbox" rel="add-on" data-add-on-type="shipping" value="500">

然后在您的職能中

calculateTotalValue(value) {
    $.each($('input[rel="add-on"]'), function(i) {
        // You probably want some error checking here
        value += this.val();
    });

    return value;
}

如有必要，您可以使用data-add-on-type來跟蹤成本的來源，並為用戶輸出列表。