Question

function addition(){

     var count = 2;
     for(var i = 0 ; i <=count ; i++ ){
           var val = document.getElementById('num');
           alert(val.value);
     }

}
<input type="text" id="num" name="name[]">
<input type="text" id="num" name="name[]">
<input type="submit" id="num"  onclick="addition">

我希望在单个ID或名称的帮助下获取输入值，请帮助我如何获取它。

Answer 1

页面中只能有一个ID。改为使用类，元素或属性选择器。

使用类作为输入（在这种情况下按钮不需要类/ id），您可以使用Document.getElementsByClassName()获取所有元素，而不是迭代集合：

function addition(){
     var val = document.getElementsByClassName('num');
         
     for(var i = 0 ; i < val.length ; i++ ){
           console.log(val[i].value);
     }

}

<input type="text" class="num" name="name[]">
<input type="text" class="num" name="name[]">
<input type="submit" onclick="addition()">

Answer 2

有几个问题，

提交按钮

onclick未调用addition。

即。在()

之后添加addition

<input type="submit" id="num" onclick="addition()">

循环条件无效，它将确保永远不会发生迭代for(var i = 0 ; i <=count ; i++ ){，因为count为0。

将计数增加到2

 var count = 2;

document.getElementById只返回一个元素，因为ID应该是唯一的。

使用data-id（或类或任何其他data-属性）代替并使用querySelectorAll查询这些元素

<强>演示

＆＃13;

function addition() {
  var allInputs = document.querySelectorAll("input[data-id='num']");
  for (var i = 0; i < allInputs.length; i++) {
    var val = allInputs[i];
    console.log(val.value);
  }
}

＆＃13;

<input type="text" data-id="num" name="name[]" value="1">
<input type="text" data-id="num" name="name[]" value="2">
<input type="submit" id="num" onclick="addition()">

＆＃13;

Answer 3

如果这是您的代码，则无法复制id。您可以使用相同的类名称拥有多个字段，但ID应该不同。

Answer 4

对于javascript，一个元素的一个id是一个好习惯。如果要获取所有值，则可以使用class属性。所以你也可以像这样使用 document.querySelectorAll -

<input type="text" class="num" name="name[]">
<input type="text" class="num" name="name[]">
<input type="submit" onclick="addition()">

function addition(){
     var val = document.querySelectorAll('.num');

     for(var i = 0 ; i < val.length ; i++ ){
           console.log(val[i].value);
     }

}

无法使用js获取输入值

4 个答案: