JavaScriptを使い、複数のフォームへ一斉に同じ値を入れる処理をしたいのですが、どのようにしたらよいでしょうか?


具体的には、同じ構成で名前だけ異なるフォーム form1/form2/form3...があって、form1のtextというテキストボックスに文字を入れると、form2とform3のtextにも同じように文字が入る...という仕組みを作りたいと思っています。

どうぞ、よろしくお願いします。

回答の条件
  • 1人2回まで
  • 登録:2006/10/22 05:04:12
  • 終了:2006/10/22 06:28:47

回答(2件)

id:backupper No.1

backupper回答回数95ベストアンサー獲得回数102006/10/22 05:30:34

ポイント45pt

以下ではどうでしょうか?

<html>
<head>
<title>title</title>
<script type="text/javascript">
function fillinform(self) {
  document.forms['form2'].elements['text'].value = self.value;
  document.forms['form3'].elements['text'].value = self.value;
}
</script>
</head>
<body>
<form name="form1"><input type="text" name="text" value="" onkeyup="fillinform(this);"></form>
<form name="form2"><input type="text" name="text" value=""></form>
<form name="form3"><input type="text" name="text" value=""></form>
</form>
</body>
</html>
id:amayan

さっそくの回答ありがとうございます!まさにこういう感じです。

実はこの複数フォームはCGIによって自動生成されるもので、1個だけの場合もあれば十数個の場合もあるのです。

こういった場合も対応できるようにするためには、どうしたらいいでしょうか?

2006/10/22 05:54:49
id:dungeon-master No.2

dungeon-master回答回数571ベストアンサー獲得回数402006/10/22 06:15:59

ポイント45pt

とりあえず、素直にdocument内にある全Formの全Elementについてループし、

名前が同じなら値をCopy。

<HTML><HEAD>
<Script language='javascript'>
function fldcopy(x){
  for(j=0;j< document.forms.length ;j++ ){
    for(i=0;i< document.forms[i].elements.length ;i++){
      fld=document.forms[j].elements[i];
      if( fld.name == x.name ){ fld.value=x.value ; }
    }
  }
}
</script>
</HEAD>
<BODY>
<form name=F1>
1<input name="FLD1" type=text onChange="fldcopy(this)">
2<input name="FLD2" type=text onChange="fldcopy(this)">
3<input name="FLD3" type=text onChange="fldcopy(this)">
</form>
<form name=F2>
1<input name="FLD1" type=text onChange="fldcopy(this)">
2<input name="FLD2" type=text onChange="fldcopy(this)">
3<input name="FLD3" type=text onChange="fldcopy(this)">
</form>
<form name=F3>
2<input name="FLD2" type=text onChange="fldcopy(this)">
3<input name="FLD3" type=text onChange="fldcopy(this)">
4<input name="FLD4" type=text onChange="fldcopy(this)">
</form>
<form name=F1>
2<input name="FLD2" type=text onChange="fldcopy(this)">
3<input name="FLD3" type=text onChange="fldcopy(this)">
4<input name="FLD4" type=text onChange="fldcopy(this)">
</form>
</BODY></HTML>
id:amayan

なるほど!!おかげさまで解決しました!

ありがとうございます!

2006/10/22 06:27:28

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません