两个文本字段的总和 - javascript

时间:2011-06-24 02:42:34

标签: javascript sum

我在网上找到了[这个] [1],相当困难的javascript示例,我已经在我的网站上成功实现了它。

但是,我想在一个新的文本字段中得到两个小计的结果。

传统的getElementbyIdtotal.value=total没有成功。

编辑

 function doMath()
{
    // Capture the entered values of two input boxes
    var twogiga = document.getElementById('twogig').value;
    var fourgiga = document.getElementById('fourgig').value;

    // Add them together and display
    var sum = parseInt(twogiga) + parseInt(fourgiga);
    document.getElementById('total').value = parseInt(sum);
}

这是我使用的javascript。但由于某些原因,当我只有一个值(twogig)时,total被设置为NaN。我的剧本出了什么问题?

3 个答案:

答案 0 :(得分:6)

好吧,如果您已将ID分配给文本输入,例如:< input type =“text”id =“my_input”/>,则可以使用document.getElementById('my_input')调用它。

所以:

<input type="text" id="my_input1" />
<input type="text" id="my_input2" />
<input type="button" value="Add Them Together" onclick="doMath();" />

<script type="text/javascript">
    function doMath()
    {
        // Capture the entered values of two input boxes
        var my_input1 = document.getElementById('my_input1').value;
        var my_input2 = document.getElementById('my_input2').value;

        // Add them together and display
        var sum = parseInt(my_input1) + parseInt(my_input2);
        document.write(sum);
    }
</script>

当然,这是一个非常基本的脚本,它不会检查以确保输入的值是数字。我们必须将字段转换为整数,否则它们将是字符串(因此2 + 2将等于22)。单击该按钮时,将调用该函数,该函数为每个输入框创建一个变量,将它们转换为整数,添加它们并输出我们的总和。

答案 1 :(得分:3)

替换:

document.getElementById('total').value = parseInt(sum);

使用:

document.getElementById('total').value = sum;

您已经完成了所有需要进行的int解析。

答案 2 :(得分:0)

$("#value1, #value2").on('focusout', function() {
  var value2 = parseInt($("#value2").val()) > 0 ? parseInt($("#value2").val()) : 0;
  var value1 = parseInt($("#value1").val()) > 0 ? parseInt($("#value1").val()) : 0
  var sumOfValues = value1 + value2;
  console.log('Your sum is ' + sumOfValues);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="input" id="value1">
<input type="text" class="input" id="value2">