JavaScript - 从数组中的多个输入获取值

Question

我试图从数组中具有相同id的多个输入中获取值。 我已经使用了论坛，但没有＃39;为我找到解决方案。

〔实施例

<input type="hidden" value="'+image_url+'" name="webcampics[]" id="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" id="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" id="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" id="webcampics">


  var elem = document.getElementById("webcampics");
  var names = [];
  for (var i = 0; i < elem.length; ++ i) {
     names += elem[i]+'|';
  }
  var webcamval = names;

Answer 1

您不应该在文档中包含具有相同 id 的元素。根据规范，ID在整个标记中必须是唯一的。如果你这样做，document.getElementById之类的方法只会匹配第一次出现。

使用class代替ids。

<input type="hidden" value="'+image_url+'" name="webcampics[]" class="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" class="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" class="webcampics">
<input type="hidden" value="'+image_url+'" name="webcampics[]" class="webcampics">

var inputs = document.getElementsByClassName( 'webcampics' ),
    names  = [].map.call(inputs, function( input ) {
        return input.value;
    }).join( '|' );

演示：http://jsfiddle.net/QgJrq/

Answer 2

你所要求的是错误的错误，建议身份证应该是独特的，但为了学习者的缘故，这就是你要做的事情

  var elem = document.getElementsByTagName("input");
  var names = [];
  for (var i = 0; i < elem.length; ++i) {
    if (typeof elem[i].attributes.id !== "undefined") {
      if (elem[i].attributes.id.value == "webcampics") {
        names.push(elem[i].value);
      }
    }
  }
  var webcamval = names;

http://jsfiddle.net/5vamG/

由于有人在完全解释为什么上面提到的方法错误之后有人投票，但是确切地说你要求的是，这是正确的方法。

将所有输入ID更改为类

  var elem = document.getElementsByClassName("webcampics");
  var names = [];
  for (var i = 0; i < elem.length; ++i) {
    if (typeof elem[i].value !== "undefined") {
        names.push(elem[i].value);
      }
    }
  }
  var webcamval = names;

http://jsfiddle.net/5vamG/1/

Answer 3

1. 您不应该有多个具有相同id的元素。

2. getElementById只返回一个元素;使用getElementsByName将返回您寻找的列表。