締切済み

複数行を独立してテキストエリアに表示させたい

2011/04/03 14:29

皆さんの回答にはいつもお世話になっている、javascript初心者です。普段はネット上から必要なソースをコピー・改変して利用していますが、今回はその内容を拡張する必要があったため、その方法が分からず質問させて頂きます。まず、以下のソースを作成しました。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis" /> <script> function update(form) { form.hoge4.value = form.hoge0.value + '\ '; if(form.hoge1[0].checked) { form.hoge4.value += form.hoge1[0].value + '\ '; } else if (form.hoge1[1].checked) { form.hoge4.value += form.hoge1[1].value + '\ '; } else if (form.hoge1[2].checked) { form.hoge4.value += form.hoge1[2].value + '\ '; } else if (form.hoge1[3].checked) { form.hoge4.value += form.hoge1[3].value + '\ '; } if(form.hoge2[0].checked) { form.hoge4.value += form.hoge2[0].value + '\n'; } else { form.hoge4.value += form.hoge2[1].value + '\n'; } } </script> </head> <body> <form action=""> 名前：<input type="text" name="hoge0" value="">　趣味 <input type="checkbox" name="hoge1" value="ゲーム">ゲーム <input type="checkbox" name="hoge1" value="PC">PC <input type="checkbox" name="hoge1" value="釣り">釣り <input type="checkbox" name="hoge1" value="車">車　配偶者 <input type="radio" name="hoge2" value="あり">あり <input type="radio" name="hoge2" value="なし">なし <br> <br> <textarea name="hoge4" value="" rows="5" cols="40"></textarea> <br> <button type="button" onclick="update(this.form);">内容反映</button> <input type="reset" value="リセット"> </form> </body> </html> この内容は、テキストボックスとチェックボックスとラジオボタンの組み合わせをボタン押下で下部のテキストエリアに反映させるというものです。現状では、 1,テキストボックスが1つ 2.チェックボックスは複数あるうち1つを選択した場合しか反映されない 3.名前～なしまでが回答項目だが、1行(1人分)しかないという内容ですが、これをテキストボックスとチェックボックスとラジオボタンの配置順は変えず、以下のように変更する事を希望しています。 1,テキストボックスが2つ 2.チェックボックスは複数あるうち単数/複数どちらを選択した場合でも全て反映される 3.名前～なしまでの回答項目を、複数行(30人分を想定しています)作成し、反映結果は田中ゲーム車あり鈴木ゲーム釣りあり伊藤釣り車なし … … のようにそれぞれの項目は半角スペースを空けて、ラジオボタンの回答項目のところで改行する、というものにする。私は1つのまとまり（今回はテキストボックスとチェックボックスとラジオボタン）をテキストエリアに反映させる仕組みは分かったと思うのですが、この「まとまり」が複数になったときに応用がきかず困っています。不勉強の私ですが、皆さんのお力添えをどうぞ宜しくお願い致します。

1878237564
お礼率35% (6/17)

JavaScript
回答数1
ありがとう数0

みんなの回答 （1）
専門家の回答

みんなの回答

fujillin
ベストアンサー率61% (1594/2576)

2011/04/05 22:15 回答No.1

ご質問の意味がよくわかってませんが、回答がないみたいなので… 頭からinputタグを見ていって1セット（7個）ごとに改行を入れるというのでは？対象はtype="text"、"checkbox"、"radio"に限定して、入力が無いものは無視。（改行は入るので、1行全部入力なしだと空行になります）質問を理解していないので、ご参考にでもなればという程度です。（全角空白は半角に） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Script-Type" content="text/javascript"> </head> <script type="text/javascript">  </script> <body> <form> 名前：<input type="text" name="hoge0" value="">　趣味 <input type="checkbox" name="hoge1" value="ゲーム">ゲーム <input type="checkbox" name="hoge1" value="PC">PC <input type="checkbox" name="hoge1" value="釣り">釣り <input type="checkbox" name="hoge1" value="車">車　配偶者 <input type="radio" name="hoge2" value="あり">あり <input type="radio" name="hoge2" value="なし">なし <br> 名前：<input type="text" name="hoge10" value="">　趣味 <input type="checkbox" name="hoge11" value="ゲーム">ゲーム <input type="checkbox" name="hoge11" value="PC">PC <input type="checkbox" name="hoge11" value="釣り">釣り <input type="checkbox" name="hoge11" value="車">車　配偶者 <input type="radio" name="hoge12" value="あり">あり <input type="radio" name="hoge12" value="なし">なし <p> <textarea name="hoge4" value="" rows="5" cols="40"></textarea><br> <button type="button" onclick="update(this.form);">内容反映</button> <input type="reset" value="リセット"> </p> </form> </body> </html>

ログインすると、全ての回答が全文表示されます。