如果第一个隐藏字段包含内容,则将复选框值添加到另一个隐藏输

时间:2013-04-18 01:02:12

标签: javascript jquery html

我有一组4个复选框。

如果选中任何两个,则将其值复制到两个隐藏的输入字段。

第一个选中的复选框值转到第一个输入id="checkedBox1"

如何获取第二个选中的复选框值以转到第二个隐藏的输入字段id="checkedBox2"

我使用下面的JavaScript函数将值放入各个复选框的每个输入中,但无法弄清楚如何遍历所有四个复选框的列表,并将两个选中的复选框放入每个单独的输入字段中。 / p>

复选框:

<input type="checkbox" value="test1" id="a" name="one"><label>Test11</label>
<input type="checkbox" value="test2" id="b" name="one"><label>Test12</label>
<input type="checkbox" value="test3" id="c" name="one"><label>Test13</label>
<input type="checkbox" value="test4" id="d" name="one"><label>Test14</label>

  <input type="hidden" value="" id="checkedBox1">
  <input type="hidden" value="" id="checkedBox2">

<script>
function populate() {
  var checkboxes = document.getElementsByName('one');
  var ip1 = document.getElementById('checkedBox1');
  var ip2 = document.getElementById('checkedBox2');

  // clear current values
  ip1.value = ip2.value = '';

  var first = false;
  var second = false;

  // Loop over checkboxes,stop when found 2 that are checked
  for (var i=0,iLen=checkboxes.length; i<iLen || !(first && second); i++) {

  if (checkboxes[i].checked) {

  if (!first) {
    ip1.value = checkboxes[i].value;
    first = true;

  } else if (!second) {
    ip2.value = checkboxes[i].value;
    second = true;
  }
  }
  }
  }

 $('input[type="checkbox"]').on('change', function() {
 populate();
 }).change();
 </script>

1 个答案:

答案 0 :(得分:5)

您可以尝试使用纯JS,但我会使用表单属性访问而不是 getElementsByName getElementById

function populate() {
  var checkboxes = document.getElementsByName('one');
  var ip1 = document.getElementById('checkedBox1');
  var ip2 = document.getElementById('checkedBox2');

  // clear current values
  ip1.value = ip2.value = '';

  var first = false;
  var second = false;

  // Loop over checkboxes,stop when found 2 that are checked
  for (var i=0,iLen=checkboxes.length; i<iLen || !(first && second); i++) {

    if (checkboxes[i].checked) {

      if (!first) {
        ip1.value = checkboxes[i].value;
        first = true;

      } else if (!second) {
        ip2.value = checkboxes[i].value;
        second = true;
      }
    }
  }
}

修改

感谢Mal,每次都添加一行来清除隐藏输入的值。