人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

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

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

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

●質問者: あまやん
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:JavaScript テキスト ボックス 名前
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● backupper
●45ポイント

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

<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>
◎質問者からの返答

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

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

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


2 ● dungeon-master
●45ポイント

とりあえず、素直に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>
◎質問者からの返答

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

ありがとうございます!

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ