Question

我正在寻找一些Javascript代码来计算多个HTML输入值的总和。关闭输入的数量是动态的，所以我正在寻找类似“为每个”输入的东西。

数字格式为1 000,00（空格为千位分隔符，小数分隔符）。

我的输入是和数组，所以ID和NAME是这样的：

input_sum1[0]
input_sum1[1]
input_sum1[2]

input_sum2[0]
input_sum2[1]
input_sum2[2]

有什么建议吗？

提前致谢！

Answer 1

一个jQuery示例。为文本框提供了一个类名。

Working Demo

   <script>
        $(document).ready ( function () {
            $("#btn1").click ( function () {
              var resultVal = 0.0;
               $(".test").each ( function() {
                   resultVal += parseFloat ( $(this).val().replace(/\s/g,'').replace(',','.'));
                });
                alert ( resultVal );  
            });
        });
    </script>

    <input type="text" value="10" class="test" />
        <input type="text" value="20" class="test" />
        <input type="text" value="30.50" class="test" />
        <input type="text" value="1" class="test" />
        <input type="text" value="1" class="test" />
        <br />
        <button id="btn1">click</button>

Answer 2

为您的表单id，让生活更轻松。
通过document.getElementById获取对表单对象的引用（或者如果您使用的是Prototype或jQuery，则可以使用简写方法）。
遍历表单的elements数组。
测试每个元素以查看它是否为文本输入字段。
如果是，请检索其value属性;它将是一个字符串。
在其上使用正则表达式删除空格。
可能需要将逗号转换为点，但我没有测试过;如果是这样，另一个正则表达式。
使用parseFloat获取值。
将其添加到您的总和中。
利润

Answer 3

您没有在JavaScript中获得可识别区域设置的数字解析，因此您必须进行字符串替换才能获得parseFloat()将要处理的内容：

<div id="inputs">
    <input type="text" />
    <input type="text" />
    ...
</div>
<p>
    <input type="button" id="summer" value="Sum" />
    <input type="text" id="sum" />
</p>

<script type="text/javascript">
    document.getElementById('summer').onclick= function() {
         var sum= 0;
         var inputs= document.getElementById('inputs').getElementsByTagName('input');
         for (var i= inputs.length; i-->0;) {
             var v= inputs[i].value.split(',').join('.').split(' ').join('');
             if (isNaN(+v))
                 alert(inputs[i].value+' is not a readable number');
             else
                 sum+= +v;
         }
         document.getElementById('sum').value= sum;
    };
</script>

（如果您不希望提交纯粹的客户端内容，则不需要＆lt; form＆gt;元素或任何输入名称。）

请注意，这使用浮点数，因此0.1和0.2之和可能与您的想法不完全相同。如果您正在查看金额，浮点数不合适，您将不得不提出一个定点或基于十进制的数字解析器。

Javascript计算多个HTML输入值的总和

3 个答案: