数字输入类型的所有属性的总和

时间:2017-09-15 07:54:10

标签: javascript html

我有一个可折叠按钮,其中包含大约10个具有max和min属性的输入类型编号字段。像这样

<div id="demoX1" class="collapse"> 
<table>
<tr><td>ABC</td><td><input type="number" min="0"  max= "1" onblur="getTotal()"name="cm"></td>
</tr>
<tr><td>XYZ</td> <td><input type="number" min="0" max= "3" onblur="getTotal()"name="cm"></td>
</tr>
<tr><td>PQR</td> <td><input type="number" min="0" max="1" onblur="getTotal()" name="cm"></td>  
</tr>
</table>
</div>
<input type= "text" id="total1" disabled/>

我想获得所有max属性值的总和。此外,如果可以在运行时禁用任何输入并忽略其总和值。我尝试在每个函数中嵌入onblur函数并使用下面的函数:onblur()

var arr1 = document.getElementsByName('cm').getAttribute("max");
var overAll= 0;
for(var i=0;i<arr1.length;i++){
    if(parseInt(arr1[i].value))
        overAll += parseInt(arr1[i].value);
}
document.getElementById('total1').value = overAll;

1 个答案:

答案 0 :(得分:0)

getElementsByName会返回一个集合,但您只能在一个元素上调用getAttribute()。您需要在循环中执行此操作,而不是在分配给arr1时。

您想要的值位于max属性中,而不是value

var arr1 = document.getElementsByName('cm');
var overAll = 0;
for (var i = 0; i < arr1.length; i++) {
  var max = arr1[i].getAttribute('max');
  if (max) {
    overAll += parseInt(max, 10);
  }
}
document.getElementById('total1').value = overAll;
<div id="demoX1" class="collapse">
  <table>
    <tr>
      <td>ABC</td>
      <td><input type="number" min="0" max="1" name="cm"></td>
    </tr>
    <tr>
      <td>XYZ</td>
      <td><input type="number" min="0" max="3" name="cm"></td>
    </tr>
    <tr>
      <td>PQR</td>
      <td><input type="number" min="0" max="1" name="cm"></td>
    </tr>
  </table>
</div>
<input type="text" id="total1" disabled/>