javascript - 从元素列表中获取每个控件的值？

Question

我正在努力从 JavaScript 中的控件获取输入值，我认为这可能与我循环遍历的控件集合有关。

我的页面由许多带有小数的输入控件组成。我只对以“txtinput”名称开头的控件感兴趣，并且我需要计算每个控件中的值。然而，当我使用下面的代码执行此操作时，我似乎得到的只是每个元素的 JSON 字符串。

 function TallyPoints() {

    var eles = [];
    var inputs = document.getElementsByTagName("input");
    var total = 0; 
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].name.indexOf('txtpoints') == 0) {
            total += document.getElementsByName(inputs[i].name)[0].value;
        }
    }

    alert('Total: ' + total.toString());

};

我最终得到的值如下所示:

Total: 0{"enabled":false,"emptyMessage":"","validationText":"333.33","valueAsString":"333.33","minValue":-70368744177664,"maxValue":70368744177664,"lastSetTextBoxValue":"333.33"}{"enabled":false,"emptyMessage":"","validationText":"5.66","valueAsString":"5.66","minValue":-70368744177664,"maxValue":70368744177664,"lastSetTextBoxValue":"5.66"}

有什么想法吗？

Answer 1

您可能想要 parseFloat() 所以你的添加工作正常( fiddle ):

var inputs = document.querySelectorAll("input[name^=txtpoints]");
var total = [].reduce.call(inputs, function (p, c) {
    <b>return p + (parseFloat(c.value) || 0);</b>
}, 0);

_{另请参阅 parseInt() , isNaN() ，和Array.prototype.<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce" rel="noreferrer noopener nofollow">reduce()</a>}