• 締切済み

<textarea>にプルダウンを表示させたい

いつも、当コーナーで大変お世話になっております。 今回も、壁にぶつかってしまいましたのでご質問させていただきます。 (今回も、CSSやPHP等は使用しません(・・・というより、使用できません)) いま下記のタグ構成(JavaScript)でページを作成しています。 --------------------------------------- <html> <head> <title>sample</title> </head> <body bgcolor="lightgreen"> <center> <span style="width:500;height:40;font-size:25pt;font-family:ふみゴシック;color:#ff6533;filter:shadow(color=#000000);">インバウンド or アウトバウンド</span> <br> <br> <table> <tr> <td> <script language="javascript"> <!-- function fun_set(set_name){ txtarea.value = eval(set_name).value; } //--> </script> <select name="状態" size="1" onChange="javascript:fun_set(状態);"> <option value="">選択してください <option value="(開始時間 8/?? 0:00) 【問い合わせ】 応答者情報 ・応答者  氏名: (続柄:) ・応答者 電話番号  固定:  携帯: 【結果】 ・8/ 0:00 現アポ完 (完了時間 0:00)">インバウンド <option value="(開始時間 8/?? 0:00) 【問い合わせ】 応答者情報 ・応答者  氏名: (続柄:) ・応答者 電話番号  固定:  携帯: 【結果】 ・8/ 0:00 現アポ完 (完了時間 0:00)">インバウンド(いわき) <option value="(開始時間 8/?? 0:00) 【発信詳細】 応答者情報 ・応答者  氏名: (続柄:) ・応答者 電話番号  固定:  携帯: 【結果】 ・資料郵送希望 確認完了 (完了時間 0:00)">アウトバウンド </select> </td> </tr> <tr> <td> <textarea name="txtarea" cols="100" rows="25"></textarea> </td> </tr> </table> </center> </body> </html> --------------------------------------- <textarea>内を上部プルダウンより内容を選択して活用するツールです。 ここで、プルダウンより選択した項目の内容が<textarea>に表示された後、更にその中でプルダウンメニューを作成したいです。 どのようにすれば作成できますでしょうか? イメージは下記に掲載しております。 お手数かけて申し訳ありませんが、何卒、ご教授の程よろしくお願いいたします。

みんなの回答

回答No.1

テキストエリアの中にセレクトメニューを入れるのは無理です。テキストしか入らないので。 上に重ねて入ってるっぽく見せることならできますが、別のアプローチ考える方が現実的だと思います。 1、セレクトメニューの下にテキストエリアを配置した組み合わせを入力数分用意して分割する。 [セレクトメニュー1] [ テキストエリア1 ] [セレクトメニュー2] [ テキストエリア2 ] 2,テキストエリアの上にセレクトメニューをすべて配置して、選択されたらその項目の値を挿入する [セレクトメニュー1][セレクトメニュー2] [     テキストエリア       ] 3,2と同じくセレクトメニューをすべて配置、 1→2→3→…と連動させて、最期まで選んだところで内容を繋げたものをテキストエリアに挿入

関連するQ&A

  • プルダウンによる表示制御方法

    プルダウンの選択内容による表示の切り替えを行いたいです。 例えば、AとCを選択すると下にあるテキストボックスが非表示になり Bを選択するとテキストボックスが表示するように制御を行いたいです。 <table align="center" border="0" cellpadding="0" cellspacing="0"> <tr><td> <form name="a"> <SELECT NAME="b"> <OPTION SELECTED> <OPTION VALUE="0">A <OPTION VALUE="1">B <OPTION VALUE="2">C </SELECT> </td></tr> <tr><td> <input type="text" size="6" maxlength="5" name="text1" value=""> </td></tr> </form> </table></form></td></tr></table> すみませんが、よろしくお願い致します。

    • ベストアンサー
    • HTML
  • プルダウンで選択したCGIを動かしたい(ACTION=""をプルダウンで変更するには?)

    プルダウンで選択したCGIを動かしたい(ACTION=""をプルダウンで変更するには?) 以下の <option value="test1.cgi">テスト1  <option value="test2.cgi">テスト2 <option value="test3.cgi">テスト3 <option value="test4.cgi">テスト4 4つのプルダウンメニューを選択して、それぞれ別のCGIを動かすには どうしたらできますか? よかったら教えて下さい。javascriptで出来そうな気がするのですが… <FORM name="testname" method="post" ACTION="/cgi-bin/??????" > <TABLE> <TR><TD> テスト</TD> <TD bgcolor="#FFFFFF"> <SELECT name=""> <option value=""> <option value="test1.cgi">テスト1  <option value="test2.cgi">テスト2 <option value="test3.cgi">テスト3 <option value="test4.cgi">テスト4 </SELECT></TD> </TR> <TR> <TD bgcolor="#cccccc" width="150"> 開始日</TD> <TD bgcolor="#FFFFFF"> <input name="daysS" type="text" size="8"> </TD> </TR> <TR> <TD bgcolor="#cccccc" width="150"> 終了日</TD> <TD bgcolor="#FFFFFF"> <input name="daysE" type="text" size="8"> </TD> </TR> </TABLE> <BR> <INPUT type="submit"name="send"value="開始"> <INPUT type="reset" name="reset" valiu="消去"> </FORM>

  • プルダウンの選択値により活性・非活性化したい

    プルダウンの選択値によりその他のプルダウンメニューやテキストエリアを活性・非活性化したいです。 下記の例では「OS」のプルダウンが「Windows」と選択されたならば、「Windowsのバージョン」のプルダウンや「Windowsのサービスパック」のテキストエリアを活性化させ、OSのプルダウンがWindows以外ならば非活性化させたいのですが、どのようにすれば実現可能でしょうか <html> <head> </head> <body> <table> <tr> <td>OS</td> <td><select id="IDOS"> <option value="">-</option> <option value="Windows">Windows</option> <option value="Mac">Mac</option> <option value="Linux">Linux</option></select> </td> </tr> <tr> <td>Windowsのバージョン</td> <td><select id="IDVersion"> <option value="">-</option> <option value="XP">XP</option> <option value="Vista">Vista</option> <option value="7">7</option></select> </td> </tr> <tr> <td>Windowsのサービスパック</td> <td><input type="text" value="" size="30"> </td> </tr> </table> </body> </html> <!-- end footer -->

  • プルダウンの初期値に関して

    教えて下さい。 PHPとJavascript、DBはMySWLを使用してプルダウンにて選択した 内容を、別のテキストエリアに表示させるような事をしようとしています。 javascriptで選択されたものを別エリアに表示させ、さらには前回値をテキストエリアに再表示させる事は可能ですが、次に登録しようとした際に、プルダウンを選択していないとせっかく登録した内容がプルダウンの初期値で上書きさせれてしまいます。 何か、テキストにデータが存在した場合には、プルダウンの情報で上書きしないか、そもそもプルダウンの内容を覚えておくような事はできないでしょうか。。。 現在作成している記述です。 print("<TR>\n"); print("<TD NOWRAP><FONT SIZE='3'><B>【行  先】</B></FONT></TD>\n"); print("<TD NOWRAP SIZE='30'><input name='text1' VALUE=$out></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'> <option value=' '>                      <option value='自席' style='background-color:#FFFFFF; color:#3366FF'>自席 </select>\n"); print("</TD>\n"); print("</TR>\n"); よろしくお願いします。

    • ベストアンサー
    • PHP
  • php メールフォーム プルダウンメニュー

    プルダウンメニューを使用して、フォーム→確認→送信と順々に値を受け取りたいのですが、form.phpではプルダウンメニューは表示されますが、form.phpで選択したプルダウンメニューがconfirm.phpでは表示されません。 confirm.phpでも表示されてなおかつ送信をしたら受け取れるようにしたいのです。 初心者なので、いろいろと勉強をしながら、本を読んだり、調べたのですが、まったくわからずです。どなたかご教授お願いします。 form.php <form method="post" action="confirm.php"> <table cellpadding="0" cellspacing="0" border="0"><tr><td>項目</td><td>入力欄</td><td>記入例</td></tr> <tr><td><label for="name">名前</label></td><td><input type="text" size="50" name="name" id="name" value="<?php print h(@$_SESSION['name']); ?>" /></td><td>例:goo 太郎</td></tr> <tr><td><label for="mail">生年月日</label></td><td> <select name="year[]"><option value="1970">1970</option><option value="1971">1971</option><option value="1972">1972</option><option value="1973">1973</option><option value="1974">1974</option></select>年 <select name="month[]"><option value="01">01</option><option value="02">02</option><option value="03">03</option><option value="04">04</option><option value="05">05</option><option value="06">06</option></select>月 <select name="day[]"><option value="01">01</option><option value="02">02</option><option value="03">03</option><option value="04">04</option><option value="05">05</option><option value="06">06</option></select>日 </td><td>例:1990年01月01日</td></tr> <tr><td colspan="3" style="text-align:center;"><input type="hidden" name="aaa" value="<?php print h($aaa); ?>" /><input type="submit" value="確認" /></td></tr> </table></form> confirm.php session_start(); $_POST = checkInput($_POST); if (isset($_POST['aaa']) && isset($_SESSION['aaa'])) { $aaa = $_POST['aaa']; if (!in_array($aaa, $_SESSION['aaa'])) { die('不正アクセスの疑いがあります。'); } } else { die('不正アクセスの疑いがあります。'); } $name = isset($_POST['name']) ? $_POST['name'] : NULL; $kana = isset($_POST['kana']) ? $_POST['kana'] : NULL; $mail = isset($_POST['mail']) ? $_POST['mail'] : NULL; $comment = isset($_POST['comment']) ? $_POST['comment'] : NULL; $error = array(); ★★★各項目のチェック★★★ $_SESSION['name'] = $name; $_SESSION['kana'] = $kana; $_SESSION['mail'] = $mail; $_SESSION['comment'] = $comment; $_SESSION['error'] = $error; <table class="form" cellpadding="0" cellspacing="0" border="0"> <tr><td>項目</td><td>入力欄</td><td class="title_color" style="border-left:1px solid #ffffff;">記入例</td></tr> <tr><td>名前</td><td class="title_back2"><?php print h($name);?></td><td>例:goo 太郎</td></tr> <tr><td>生年月日</td><td>★★★★★ここにform.phpからのプルダウンメニューを受け取りたい★★★★★</td><td>例:1990年01月01日</td></tr> </table> <table cellpadding="0" cellspacing="0" border="0"> <tr> <td><form action="form.php" method="post"><input type="submit" value="戻る" /></form></td> <td><form action="send.php" method="post"><input type="hidden" name="aaa" value="<?php print h($aaa);?>" /><input type="submit" value="送信" /></form></td> </tr></table>

    • ベストアンサー
    • PHP
  • プルダウンメニューの利用

    htmlのプルダウンメニューを使用した値計算のインタフェースを作成したいと思っています。 プルダウンメニューに設定するメニュー項目に値を設定し、 onChangeを使用して、その値だけをPHPプログラムに渡すようにしたいのですが、 JavaScript部分をどのように書けばいいのか判りません。 どなたかご教授お願いいたします。 <form name="formtest" action="test.php" method="post"> <table> <tr> <th>カテゴリ*</th> <td> <SELECT NAME="iPlanet" onchange=""> <OPTION VALUE="9" selected>初期値 <OPTION VALUE="0">サンプル1 <OPTION VALUE="1">サンプル2 </SELECT> </td></tr> </table> </form> onchangeでValueの値をPHPに送りたいのです。 よろしくお願いします。

  • プルダウンのoptionの表示・非表示はできますか?

    JavaScriptを使ってプルダウン操作をしております。 一つ目のプルダウンで選択したあと2つ目のプルダウンのoptionの部分だけ表示・非表示をしたいのです。そんなことはできるのでしょうか? 下のソースで説明しますが、一つ目のリストで「あいうえお」を選択した時点で2つ目の選択リストの「ひらがな1」と「ひらがな2」だけを選択できるようにしたいのです。「カタカナ1」「カタカナ2」は非表示もしくは選択不可にできればいいのですが。 一つ目のプルダウンリスト <select name="formtype" onchange="form_indicate();"> <option value="AAA">あいうえお <option value="BBB">アイウエオ </select> 二つ目のプルダウンリスト <select name="formtype2"> <option value="aaa">ひらがな1 <option value="bbb">ひらがな2 <option value="ccc">カタカナ1 <option value="ddd">カタカナ2 </select>

  • textareaでのデータ受け渡し

    入力画面と参照画面を作成しています 入力画面にtextareaと参照ボタンがあります 両画面ともPHPとテンプレートファイルを使用しています 下記のようにテンプレートファイルに記入しています <tr> <td>内容</td> <td> <textarea name=srinaiyou rows=5 cols=42></textarea> </td> </tr> <tr> <td>仕入先</td> <td> <input type=text name=sritokcd value="" size=10 maxlength=8> <input type=submit name=sub_refer value=参  照> </td> </tr> 参照画面は下記のようにPHP内で記入しています 得意先のデータが複数行になるためPHPに記入しています <table width=50% border=1 cellspacing=0 cellpadding=0> <tr bgcolor=#ccccff> <th width=15% nowrap>得意先コード</th> <th width=42% nowrap>得意先名</th> </tr> <tr> <td align=center>12354879</td> <td align=center><table border=0 cellspacing=0 cellpadding=0><form name=frm12354879 method=post action=/beta/index.php><tr><td><input type=hidden name=page value=T_SyuuriEntry> <input type=hidden name=srinaiyou value=テスト 備考> <input type=hidden name=sritokcd value=12354879> <a href=JavaScript:document.frm12354879.submit()>ABC工務店建設会社</a></td></tr></form></table></td> </tr> 入力画面のtextareaに テスト 備考 と入力して参照ボタンを押して参照画面を表示します 参照画面から得意先名を選択したら入力画面に戻るようにしていますが 入力画面が表示されるとtextareaには"テスト"しか表示されません。"備考"が消えてしまいます うまくデータが受け渡しできません 参照画面を表示した時にはデータが渡っているみたいですが... 同じような質問を見て自分なりにいろいろと試しましたが解決できません 何卒よろしくお願いします

    • ベストアンサー
    • PHP
  • プルダウンメニューのvalue値取得について

    お世話になります。 プルダウンメニューのvalue値を取得するのに以下のjavascriptとhtmlを作成しました。 3つのカテゴリプルダウンメニューのそれぞれのvalue値をflg_fileへ格納して、その値に対応したHTMLへジャンプという物なのですが、実際に動作させると、main_select02や03でvalue値を4、5と指定しているにもかかわらず、実際に動作させるとジャンプする先はlist_NO"1".htmlとなってしまっています。 これはvalue値がちゃんと取得できていないのか、それともプルダウンメニューは値を設定しても、上から自動的に1、2・・・となるのが仕様なのか、元々の作りがおかしいのか頭を悩ませています。 何がおかしいのか、ご教授頂けますようお願いします。 ■javascriptソース function flg_set(n) { switch(n){ case 1: flg_file = document.selectForm.main_select01.selectedIndex; break; case 2: flg_file = document.selectForm.main_select02.selectedIndex; break; case 3: flg_file = document.selectForm.main_select03.selectedIndex; break; } } function select_list() { parent.select.location.href = "list_NO"+[flg_file]+".html"; } ■HTMLソース <FORM NAME="selectForm"> <td width="10"> </td> <td width="120"><select name="main_select01" onChange="flg_set(1)" onFocus="this.blur()" style="font-size:12px; width:120px;"> <option value="0">▲カテゴリ(1)</option> <option value="1">┗ ページ(1)</option> <option value="2">┗ ページ(2)</option> <option value="3">┗ ページ(3)</option> </select></td> <td width="10"> </td> <td width="120"><select name="main_select02" onChange="flg_set(2)" onFocus="this.blur()" style="font-size:12px;width:120px;"> <option value="0">▲カテゴリ(2)</option> <option value="4">┗ ページ(4)</option> <option value="5">┗ ページ(5)</option> </select> </td> <td width="10"> </td> <td width="120"><select name="main_select03" onChange="flg_set(3)" onFocus="this.blur()" style="font-size:12px;width:120px;"> <option value="0">▲カテゴリ(3)</option> <option value="6" selected>┗ ページ(6)</option> </select> </td> <td width="10"> </td> <td width="100%"><input type="button" value="ページジャンプ" onClick="select_list();"> </td> </form>

  • テーブル内のプルダウンの下に余白ができてしまう

    以下のようなHTMLにて、プルダウンメニューの下になぜか余白ができてしまいます。 この余白部分を消すにはどうしたらよいでしょうか? padding-bottomを使うのかといろいろ試していますが、解決できません。 どなたかご教授いただけますと幸いです。 <html> <body> <table border='1'> <tr> <td> コンテンツから探す </td> </tr> <tr> <td> <form> <select onChange="top.location.href=value"> <option value="#"></option> <option value="page1.html">ページ1</option> <option value="page2.html">ページ2</option> <option value="page3.html">ページ3</option> </select> </form> </td> </tr> </table> </body> </html>

    • ベストアンサー
    • HTML

専門家に質問してみよう