1

ユーザーが編集できる一連の空のテキストフィールドがあるWebサイトがあります。各テキストフィールドの横には、次のようなチェックボックスがあります。

<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 />

ユーザーが[送信]をクリックしたら、テキスト入力とチェックボックスのペアを1行ずつ繰り返す方法はありますか？

たとえば、テキストフィールドとチェックボックスをグループ化して、group.textfield.value =？およびgroup.checkbox.value=？

フィールドのテキストと、その特定のフィールドでチェックボックスがオンになっているかどうかを簡単に判断する方法が必要です。

4

2 に答える 2

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 に答える
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 に答える