Question

我创建一个表单，我希望用户填写一个金额，然后显示在表单的底部。然后，如果选中了一个复选框，它会在输入字段中为该值添加21，到目前为止，我已经有了这个，但它不能正常工作。

<label>Desired amount</label> <input name="tbDesiredAmount" type="number" id="tbDesiredAmount" min="50" />
<label>Include Apron?</label> <input id="cb_Apron" type="checkbox" name="cb_Apron" /> 

<p>Total: £<span id="total">0</span>.00</p>



$('#tbDesiredAmount').blur(function() {
        var value = $('#tbDesiredAmount').val();
        $("#total").empty().append(value);
});
$('#cb_Apron').blur(function() {
        var value = $('#tbDesiredAmount').val();
        var apron = 21;
        var total = value + apron; 
        $("#total").empty().append(total);
});

所以我想要它做的例子。

将70输入“所需数量”，当您关注输入字段时，在#total中显示70。
检查围裙复选框，将所需数量加21，以便在#total
如果取消选中apron复选框，它将从#total
如果我更改了所需的金额，它将更新#total，这需要使用选中的复选框并且未勾选复选框。

任何帮助都会非常感激，因为我现在很困难。

Answer 1

尝试使用parseInt()

var apron = 21;
$('#tbDesiredAmount').keyup(function () {
    var value = $('#tbDesiredAmount').val();
    if ($('#cb_Apron').is(':checked')) {
        var total = parseInt(value) + parseInt(apron);
        $("#total").empty().append(total);
    } else {
        $("#total").empty().append(value);
    }
});
$('#cb_Apron').click(function () {
    if ($(this).is(':checked')) {
        var value = $('#tbDesiredAmount').val();
        var total = parseInt(value) + parseInt(apron);
        $("#total").empty().append(total);
    } else {
        var tot = parseInt($("#total").text()) - (parseInt(apron))
        $("#total").empty().append(tot);
    }
});

DEMO

Jquery - 如果选中复选框，则将输入值和另一个数字相加

1 个答案: