jquery的两个输入值的总和答案

【问题标题】：Sum of two input value by jqueryjquery的两个输入值的总和
【发布时间】：2011-09-27 00:48:19
【问题描述】：

我有代码：

function compute() {
    if ($('input[name=type]:checked').val() != undefined) {
        var a = $('input[name=service_price]').val();
        var b = $('input[name=modem_price]').val();
        var total = a + b;
        $('#total_price').val(a + b);
    }
}

在我的代码中，我想要两个文本输入的总和值并写入一个 id 为“total”的文本输入

例如，我的两个数字不相加：

service_price value = 2000 和 modem_price=4000 在这个例子中，总输入值必须是 6000 但它是 20004000

【问题讨论】：

meta.stackexchange.com/questions/45176/…
我正在认真考虑编写一个 jQuery 插件来使用基数解决方案进行 parseInt。

标签： javascript jquery input

【解决方案1】：

您的代码是正确的，只是您添加（连接）字符串，而不是添加整数。只需将您的代码更改为：

function compute() {
    if ( $('input[name=type]:checked').val() != undefined ) {
        var a = parseInt($('input[name=service_price]').val());
        var b = parseInt($('input[name=modem_price]').val());
        var total = a+b;
        $('#total_price').val(a+b);
    }
}

这应该可以工作。

下面是一些工作示例，当复选框被选中时更新总和（如果选中，则在更改其中一个字段时也会更新值）：jsfiddle。

【讨论】：

如果您像这样使用 parseInt，您几乎肯定会想要指定基数：parseint(userdata, 10); 如果没有这个，则使用零填充数字，例如08 将被解释为八进制，从而产生令人惊讶的值。

【解决方案2】：

因为至少有一个值是字符串，所以 + 运算符被解释为字符串连接运算符。最简单的解决方法是表明您打算将这些值解释为数字。

var total = +a + +b;

和

$('#total_price').val(+a + +b);

或者，更好的是，将它们作为数字拉出来：

var a = +$('input[name=service_price]').val();
var b = +$('input[name=modem_price]').val();
var total = a+b;
$('#total_price').val(a+b);

请参阅 Mozilla 的 Unary + 文档。

请注意，如果您知道该值无论如何都会是一个数字，这只是一个好主意。如果这是用户输入，您必须更加小心，并且可能希望使用 parseInt 和其他答案所建议的其他验证。

【讨论】：

一个正确的解释和一个很好的例子，谢谢@Sorpigal

【解决方案3】：

使用 parseInt 作为a = parseInt($('input[name=service_price]').val())

【讨论】：

@ebad gh: .val() 返回一个字符串，因此您尝试的数学运算只是连接字符串。正如 Rodolfo 建议的那样，您需要先将值转换为整数。
为了有效性，请改用parseInt($('input[name=service_price]').val(), 10)。你需要一个基数。
@teddyrised：我从未使用过基数，因为 10 始终作为默认值提供。为什么需要它？
@George Cummins：试试parseInt("080")。
@pimvdb 和@teddyrised：非常有趣。很高兴知道。

【解决方案4】：

使用parseInt

   var total = parseInt(a) + parseInt(b);


    $('#total_price').val(total);

【讨论】：

感谢您成为唯一发现 OP 制作了 var total 并且从未使用过它的答案：P

【解决方案5】：

<script>
$(document).ready(function(){
var a =parseInt($("#a").val());
var b =parseInt($("#b").val());
$("#submit").on("click",function(){
var sum = a + b;
alert(sum);
});
});
</script>

【讨论】：

你能评论你的答案吗？

【解决方案6】：

将它们转换为数字

$('#total_price').val(Number(a)+Number(b));

但在你这样做之前

if (!isNaN($('input[name=service_price]').val()) {...

【讨论】：

【解决方案7】：

如果在多个类中您想更改以下示例中显示的特定类中的附加操作

$('.like').click(function(){    
var like= $(this).text();
$(this).text(+like + +1);
});

【讨论】：