1

我有一个网站，其中包含一系列用户可以编辑的空文本字段。每个文本字段旁边都有一个复选框，如下所示：

<input type="text" id="textfield1" size="60" /><input type="checkbox"> <br />
<input type="text" id="textfield2" size="60" /><input type="checkbox"> <br />
<input type="text" id="textfield3" size="60" /><input type="checkbox"> <br />

一旦用户点击提交，有没有办法逐行遍历文本输入和复选框对？

例如，是否有可能以某种方式将文本字段和复选框组合在一起，并通过这些组进行迭代 group.textfield.value =？和 group.checkbox.value = ?

我需要一种简单的方法来确定字段的文本以及该特定字段是否选中了它的复选框

4

2 回答 2

0

只需遍历text输入，并使用.nextSibling抓取每个相邻checkbox的 .

确保不要在它们之间引入任何空格。

另一种选择是将它们分组到fieldset元素中......

<fieldset>
    <input type="text" id="textfield1" size="60" /><input type="checkbox">
</fieldset>
<fieldset>
    <input type="text" id="textfield2" size="60" /><input type="checkbox">
</fieldset>
<fieldset>
    <input type="text" id="textfield3" size="60" /><input type="checkbox">
</fieldset>

...然后迭代fieldset元素，并使用.children[0]和.children[1]

于 2012-07-18T00:17:00.710 回答
0

给每个输入一个可以用来关联对的名称（无论如何他们都需要）：

<form onsubmit="doStuff(this);">
  <input type="text" id="textfield1" name="textfield1" size="60">
   <input type="checkbox" name="textfield1-cb"> <br>
  <input type="text" id="textfield2" name="textfield2" size="60">
   <input type="checkbox" name="textfield2-cb"> <br>
  <input type="text" id="textfield3" name="textfield3" size="60">
   <input type="checkbox" name="textfield3-cb"> <br>
  <input type="submit">
</form>

<script type="text/javascript">
function doStuff(form) {
  var control, controls = form.elements;
  var pair;

  for (var i=0, iLen=controls.length; i<iLen; i++) {
    control = controls[i];
    pair = form[control.name + '-cb'];

    if (control.type == 'text' && pair) {
      // control is the input and pair is the checkbox
    }
  }
}
</script>

以上仅要求控件按名称关联，而不是按结构关联，这应该使其更加健壮。

于 2012-07-18T01:54:56.713 回答