はじめまして!
javascriptでフォームAに入力した内容を
ボタンが押されたら同一ページのフォームBに
ペーストされるscriptを作りたいのですが
そういったスクリプトを公開しているものがあれば
教えていただきたいです。よろしくお願いいたします。
やりたい事:
[フォームA]---------------------
お名前:テキスト
性別:ラジオボタン
趣味:セレクトボックス
コメント:テキストエリア
[コピーボタン]←内容をコピーするボタン
--------------------------------
↓コピーボタンが押されたら↓
[フォームB]---------------------
お名前:テキスト
性別:ラジオボタン
趣味:セレクトボックス
コメント:テキストエリア
--------------------------------
Aフォームに入力した内容Bフォームに反映される
よろしくお願いいたします。
No.1ベストアンサー
- 回答日時:
<html>
<body>
<form id="a">
<input type="text" value="osiete goo"><br>
<input type="radio" value="m" name="sex">男
<input type="radio" value="w" name="sex" checked>女<br>
<select>
<option value="0">子供の遊び</option>
<option value="1" selected>大人の遊び</option>
</select><br>
<textarea>あぁ~</textarea>
<input type="button" value="copy" onclick="copyFormValue(this.form,'b')">
</form>
<form id="b">
<input type="text" value=""><br>
<input type="radio" value="m" name="sex">男
<input type="radio" value="w" name="sex">女<br>
<select>
<option value="0">子供の遊び</option>
<option value="1">大人の遊び</option>
</select><br>
<textarea></textarea>
</form>
<script>
function copyFormValue(moto,sore){
var om=moto.elements;
var os=document.getElementById(sore).elements;
for(var i=0,m=om.length;i<m;i++){
var f=om[i].type;
if(f!='button') if(f!=os[i].type) { alert('ちがう');return;}
switch(f){
case 'text': case 'textarea': case 'hidden': os[i].value=om[i].value;break;
case 'checkbox': case 'radio': os[i].checked=om[i].checked; break;
case 'select-one': os[i].options[om[i].selectedIndex].selected=true;
}
}
}
</script>
</body>
</html>
selectのマルチには未対応
フォームはまったく同じ順序であること
No.2
- 回答日時:
厳密にやるにはもっと細かい設定が必要ですが
単純にやるならいかの方法でいけます
ただし、いくつかの条件が必要です。
・nameでひもづける。
・radio以外おなじ名前の要素をつかわない
・radioやselectは同じ要素数にする
<script>
function copyForm(){
var a=document.getElementById("a");
var b=document.getElementById("b");
for(var i=0;i<a.length;i++){
var n=a[i].name;
if(!b[n]) continue;
switch(a[i].type){
case "text":
case "textarea":
b[n].value=a[i].value;;
break;
case "select-one":
b[n].selectedIndex=a[i].selectedIndex;
break;
case "checkbox":
b[n].checked=a[i].checked;
break;
case "radio":
if(a[i].checked){
for(var j=0;j<a[n].length;j++){
if(a[i]==a[n][j]) break;
}
b[n][j].checked=true;
break;
}
}
}
}
</script>
<form id="a">
お名前:<input type="text" name="name"><br>
性別:<input type="radio" name="sex" value="0">男 <input type="radio" name="sex" value="0">女<br>
趣味:<select name="hobby">
<option value="">選択</option>
<option value="x">x</option>
<option value="y">y</option>
<option value="z">z</option>
</select><br>
コメント:<textarea name="comment">テキストエリア</textarea><br>
ついで:<input type="checkbox" name="tuide" value="1"><br>
<input type="button" value="コピー" onClick="copyForm()">
</form>
<form id="b">
お名前:<input type="text" name="name"><br>
性別:<input type="radio" name="sex" value="0">男 <input type="radio" name="sex" value="0">女<br>
趣味:<select name="hobby">
<option value="">選択</option>
<option value="x">x</option>
<option value="y">y</option>
<option value="z">z</option>
</select><br>
コメント:<textarea name="comment"></textarea><br>
ついで:<input type="checkbox" name="tuide" value="1"><br>
</form>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ラジオボタンによるフォームの開閉を行いたい 3 2022/03/31 21:30
- Access(アクセス) アクセス 意図せずサブプロシージャを移動してしまうのを止めたい 1 2022/09/02 09:19
- JavaScript javascriptで入力フォームが空欄の時にアラートによるエラーを出すコードを書いています。 2 2023/06/13 17:58
- JavaScript 空白で入力フォームのボタンをクリックしたら、ブラウザの上部からjavascriptで 表示されるアラ 1 2022/05/20 11:16
- Access(アクセス) Accessで予定表を作成しようとしてます。 テーブル フィールド名 連番 オートナンバー型 年月日 2 2023/07/23 11:40
- Visual Basic(VBA) VB.net フォーム 親子 1 2022/07/04 19:00
- Access(アクセス) Accessテーブルの結合で別々のテーブルのフィールドを組み合わせて値を出す方法について 2 2022/07/20 19:43
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- Access(アクセス) Access 登録ボタンからサブフォームの更新 1 2022/07/22 10:23
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
value内に変数を入れたい
-
hiddenのvalueの値を変えたい
-
テキストボックスに入力された...
-
value.replaceがうまく動作しま...
-
CDOMailで本文テキストの文字コ...
-
プルダウン選択時、既に入力済...
-
selectboxのoptionタグのvalue...
-
javascriptの入力制限keycode除く
-
ユーザーフォームでの検索結果...
-
name属性が同じフォームが複数...
-
ラジオボタンと連動して文字列...
-
eval()を使わずに数値を取得し...
-
フォームで入力した値を別のフ...
-
HTMLとJavaScriptについて解答...
-
[Javascript]TEXTAREAで改行さ...
-
javascriptを教えてください。
-
visual sutudio2012でのコード...
-
HTML、Javascriptでトグルボタ...
-
フレーム内のJavaスクリプトの...
-
ラジオボタンの選択で解答・点...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
value内に変数を入れたい
-
hiddenのvalueの値を変えたい
-
javascriptでhiddenに二次元配...
-
複数のsubmitボタンで押された...
-
テキストボックスに入力された...
-
switchを使って四則演算のプロ...
-
VB.NET DateTimeの型について
-
クイズ作成:15個の問題から5個...
-
セレクトボックスの初期選択状...
-
C言語クイックソートの比較総回...
-
ラジオボタンの選択で解答・点...
-
子から親へチェックボックスの...
-
ラジオボタンと連動して文字列...
-
setIntervalの間隔を途中で変更...
-
JAVASCRIPTで、ボタンを押した...
-
sessionStorageを調べています。
-
クリックの度に加算していくには?
-
3桁区切りのカンマをつけたい...
-
マクロ オブジェクト変数With...
-
selectboxのoptionタグのvalue...
おすすめ情報