セレクトメニューで値を変更する方法について
- セレクトメニューの選択項目を変更することで、入力した値を変更する方法について質問です。
- セレクトメニューの選択項目によって、計算式内での値の代入位置を変更したい場合についても相談です。
- 初心者ですので、具体的な例文を教えていただくことで理解したいので、どうぞよろしくお願いします。
- ベストアンサー
セレクトメニューの選択項目変更で入力した値を変更する。
例 第一選択のセレクトメニューで項目Aを選択。 第二選択で項目Aの数値を取得。 第一選択のセレクトメニューで項目Bを選択。 第二選択で項目Bの数値を取得。 (第二選択はセレクトかテキスト入力の予定です) 取得した値をAもしくはBに代入。 計算式(A*2)+(2/B) もしくは 計算式a (a*2)+10 計算式b (b*2)+10 と言う風に選択項目によって代入位置を変更したいです。 計算式も代入する値も多くあるのでセレクトメニューで選択して その位置を変更したいのですが、どのようにしたらいいのでしょうか? 他に良い方法とかあるものなんでしょうか?? 初心者でサンプル例文を切り張り修正でしか作れません。(-_-;) 専門用語とか詳しく説明されても解らないと思うので、 例文だけでも書いていただいたらありがたいです。 あとはなんとか例文を参考に自分で調べて構文の仕組みを理解するのでお願いします。<(_ _)>
- Cronus2
- お礼率46% (28/60)
- JavaScript
- 回答数3
- ありがとう数1
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<html><body> <select id="num" onChange="chg()"> <option value="a">a</option><option value="b">b</option> </select> <select id="prc"> <option value="100">cha</option><option value="200">twn</option> </select> <script> function chg(){ if( event.srcElement.value =="b" ){ setVal($('prc').options[0],'jpn',1000); setVal($('prc').options[1],'usa', 500); } if( event.srcElement.value =="a" ){ setVal($('prc').options[0],'cha',100); setVal($('prc').options[1],'twn',200); } } function $(n){ return document.getElementById(n);} function setVal(o,d,v){ o.innerHTML=d;o.value=v;} </script> 第一セレクトメニューの値によって、第二セレクトメニューを 動的に変化させるには？ </body></html>
その他の回答 (2)
<html><body> <select name="ahaha" id="num"> <option value="1">1</option> <option value="10">10</option> <option value="100">100</option> </select> <input type="button" value="Aに代入" onClick="document.getElementById('dta').value = document.getElementById('num').value;"; > <input type="button" value="Bに代入" onClick="document.getElementById('dtb').value = document.getElementById('num').value;"; > <br> A=<input type="text" id="dta"> B=<input type="text" id="dtb"> <br> <select name="ahaha" id="siki"> <option value="1">(A*2)+(2/B)</option> <option value="2">(a*2)+10</option> <option value="3">(b*2)+10</option> </select> <input type="button" value="計算" onClick=" var a = document.getElementById('dta').value; var b = document.getElementById('dtb').value; var ans = 0; switch( document.getElementById('siki').value ){ case '1': if(b==0) {alert( 'Error!' ); return; } ans = (a*2)+(2/b); break; case '2': ans = (a*2)+10; break; case '3': ans = (b*2)+10; break; } document.getElementById('kotae').value = ans; "> 答え<input type="text" id="kotae"> </body></html> これって問題を理解する方が難しいかも！？ これを望んでいるとは思わないし、何がどうだか・・・ でっ！どぉ？
補足
あぁ、解りにくい説明だったみたいですね^ ^; すいません。 例えばハンバーガー１個のコストを計算するのに1個当たりの食材、 人件費、設備費、雑費を決まった計算式に沿って求めたいんです。 食材はトマト(国産・中国産)、牛肉(国産・豪産)、タマネギ等とあり、産地・価格で異なり多岐にわたり、1個当たりの価格は変動します。 なので、まず第一のセレクトメニューで計算したい食材等の項目を選んで連動した第二のセレクト・テキストメニューで価格を入力。 商品によって使う食材の種類も数も変わり、1食材毎に価格入力可能に。 同様に人件費・設備費その他も同じ方式で入力して、合算して最終的に は1商品のコストを表示したいと思っています。 今一番、どうすればいいか分からないのが第一のセレクトメニュー選択で第二のセレクト・テキストメニュー入力を連動させるかです。 その第一セレクトメニューの選択項目によって代入位置が異なるので・・・。 そこだけでやり方が解れば、あとはなんとかなりそうなんですが。 よろしくお願いします。
- yambejp
- ベストアンサー率51% (3827/7415)
javascriptはともかくselectメニューくらいは例示してみては？ いまのままだと何をどうしたいのかさっぱり・・・
補足
あぁ、解りにくい説明だったみたいですね^ ^; すいません。
関連するQ&A
- セレクトメニューの選択項目によって、もう１つのセレクトメニューの項目と項目数を変更する
もう1つのセレクトメニューの項目数が同じタイプのものは、ネット上で見つけられたのですが、項目の数も違うものは見つかりませんでした。 たとえば、1つ目のセレクトメニューでAタイプとCタイプを選択すると、2つ目のセレクトメニューでは5項目から選択でき、Bタイプを選択すると、3項目から選択できるという風にしたいです。ご助言お願いします。
- ベストアンサー
- JavaScript
- セレクトメニューに値を戻す
よろしくお願いします。 現在、 (1)「入力ページ」から値を取得しCSVに書き込み (2)特定キーによりCSVの内容を「編集ページ」に読み出し と言うことを行いたいのです。 (1)は問題ないのですが、 (1)の「入力ページ」からセレクトメニューで取得した値を(2)でもセレクトメニューで取得したいのですが可能でしょうか？ 要は(1)も(2)も見た目を同じに、 「入力ページ」は新規入力用、「編集ページ」は変更・更新用というふうに使いたいです。 例えば、 セレクト項目の内容が、 北海道 青森県 岩手県 宮城県 となっており、(1)で「青森県」を選択→CSVへ書き込み とし、 (2)の表示の時にセレクトメニューには「青森県」が表示されており、かつ上記の項目が選択可能であるようにしたいのですが、 どなたか情報等お持ちの方いらっしゃいましたら、 よろしくお願いいたします。 webサーバー・・・HP-UX web・・・IE CGI開発言語・・・Perl 開発端末・・・windows2000(Tera Term 使用)
- ベストアンサー
- JavaScript
- セレクトメニューセレクトメニューへのジャンプ
こんにちは。 セレクトメニューの選択項目に応じて、もう１つのセレクトメニューの内容を変更する方法は大体理解したのですが、 さらにもう一つ、＋もう一つ・・・とセレクトメニューの項目をリンクさせて変更することは可能でしょうか？ 例えば、 セレクトメニュー(1) 選択 ↓ ジャンプ セレクトメニュー(2) 選択 ↓ ジャンプ セレクトメニュー(3) 選択 ↓ ジャンプ セレクトメニュー(4) 選択 ↓ 検索用CGI実行 クリック というように選ばれた各項目ごとに次のセレクトメニューにジャンプして項目の変更を行いたいです。 参考サンプル等、 どなたか情報をお持ちの方がおりましたら、 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- セレクトメニューで２つの項目や値を渡す方法はありますか？
良かったら教えてください。 セレクトメニューで２つの項目や値を渡す方法は ありますか？ 普通は、 <select name="test"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> と言う感じですが、 「テスト」を選ぶと name="test1" name="test2"の項目で、 value="1111" value="2222" 選択項目は、１つですが、2つの項目、 2つの値を次のCGIに渡す事は、 可能でしょうか？ 教えてください。
- ベストアンサー
- HTML
- ふたつのセレクトメニューの項目を外部ファイルから読み込ませて連動させたい。
はじめまして。質問させてください。 セレクトメニューを選択するときに たとえば、左のセレクトメニューに巨人を選択すると右の セレクトメニューには巨人の選手を選択する項目になり、 左のセレクトメニューから阪神と選ぶと、右のセレクトメニューの項目が阪神の選手の項目になるように左のセレクトメニューのと右のセレクトメニューを連動させたいです。 また、そのときのセレクトメニューの項目を外部ファイルから読み込ませたいのですが、（javascriptを知らない人でも項目を変更できるように） たとえば、ここのサイトのようにhttp://www.kyoto-su.ac.jp/~ushitaki/JavaScriptExample/introselect2.html 左のメニューの項目を選んだら、右の項目は左の項目にそった選択肢になるという形にしたいのです。 この場合どのようなやり方がありますでしょうか。ご教授のほどよろしくお願いいたします。 また、似たようなセレクトメニューがあるＵＲＬをご存知の方がいたら教えてください。よろしくお願いいたします。
- ベストアンサー
- JavaScript
- PHPでセレクトメニュー
こんにちは。 PHPでDBから読み込んだ値によってセレクトメニュー、selected のタグが付く場所を変えたいんですが、自分の知識だけだと長文になってしまい短くできないものか悩んでます。 例えば値が1-3で、対応する値がA-Cだとすると、 <select name="menu"> <option value="1" selected>A</option> <option value="2">B</option> <option value="3">C</option> </select> で、データを受け取った値によって selectedの位置を"2"の後、"3"後に変更したいです。 自分で書くと <?php if ( $row["menu_c"] == 1){ <option value="1" selected>A</option> <option value="2">B</option> <option value="3">C</option> }elseif( $row["menu_c"] == 2){ <option value="1">A</option> <option value="2" selected>B</option> <option value="3">C</option> ・・・ <option value="3" selected>C</option> } ?> のようになり、項目数分だけ毎回書き足す事になってしまします。 お分かりになる方ご教授頂けないでしょうか。
- ベストアンサー
- PHP
- INPUTで入力された値やSELECTで選択された値の取得
以下のようなHTMLで出力されるページにおいて入力された値を取得したいと思っております。 <div id="div1"> 現在<input type="text" name="TXT1" id="TXT1" size="10">が入力されています。 <br> 現在<select size="1" name="SLCT1" id="SLCT1"> <option>項目1</option> <option>項目２</option> <option>項目３</option> </select>が選択されています。 </div> 値を取得するには v1 = document.getElementById("TXT1").value で取得できるのはわかっているのですが たとえば、TXT1に「文字列１」を入力し、SLCT1で「項目２」を選択している状態で、 "現在文字列１が入力されています。現在項目２が選択されています。" のようにDIV1の中に表示されている文字列全体を取得することはできるのでしょうか。 IEでinnerTEXT、FirefoxでtextContentを利用して取得を試みたのですが、うまくいきません。 何かいい方法があればご教授願えますでしょうか。 現在想定している状況ですと、DIVの中に配置されるINPUTやSELECTの数なども不定でして、それら要素のidも不定であります。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- セレクトメニュー選択でもう一つセレクトメニューを出す
「ブロック名」のセレクトメニューを選択すると、選択した項目によってもう一つ「部署名」のセレクトメニューが出て選択するようにしたいと思い、途中まで作成しました。 しかし、「ブロック名」を「Ａブロック」選択しても「部署名」が「Ｂトップ～」が出てしまいます。 何がおかしいのか分からないので、ぜひ教えてください。 よろしくお願いいたします。 menuItem = [ ["Ａトップ","A本部","B本部","C本部"], ["Ｂトップ","1本部","2本部","3本部"], ["Ｃトップ","あ本部","い本部","う本部"], ["Ｄトップ","●本部","▲本部","◆本部"] ]; function setMenuItem(n) { len = document.form2.BUSYO.options.length; for (i=0; i<len; i++) { document.form2.BUSYO.options[i] = null; } document.form2.BUSYO.style.visibility = "visible"; for (i=0; i<menuItem[n].length; i++) { document.form2.BUSYO.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } ---------------------------------------------------------------- <SELECT size="1" name="Block" onChange="setMenuItem(this.selectedIndex)"> <OPTION selected value="0">選択してください</OPTION> <OPTION value="a-block">Aブロック</OPTION> <OPTION value="b-block">Bブロック</OPTION> <OPTION value="c-block">Cブロック</OPTION> <OPTION value="d-block">Dブロック</OPTION> </SELECT> <SELECT size="1" name="BUSYO" style="visibility:hidden"> <OPTION selected value="0">選択してください</OPTION> </SELECT>
- ベストアンサー
- JavaScript
- ボタンで選択されていないセレクトメニューの非反映
現在JavaScriptを使った、HP上での簡単な見積もりページを製作しています。 チェックボックスやラジオボタン、セレクトメニューで選ばれた項目を足して、最終的にテキストボックスに合計金額を出したいと思っています。 内容は全く違いますが、画像のような感じで項目などを作りたいと思っております。 その時に、ラジオボタンでチェックされていないセレクトメニューは選択（計算に反映）されないようにしたいのです。 （「プラスチック丸型編み込み」等が選択されている時は、「蓋付きのボックス」や「蓋付きバスケット」のセレクトメニューは選択されないようにしたいのです。） 自分の作ったものでは、「色を選択」の時点では０に設定してあるのですが、「蓋付きのボックス」のセレクトメニューが他のものを選択していた場合、それが反映されてしまうのです。 計算させるだけならできるのですが、選択されないようにする方法がわからなくて困っております。 拙い文章で申し訳ないのですが、どなたか教えてくださらないでしょうか？
- 締切済み
- JavaScript
- 条件を付けたセレクトメニューの値の取得
JavaScriptで下記の流れの入力フォームを作成しています。 (1)一つ目のセレクトメニューで選択した項目に応じて、もう１つのセレクトメニューの内容を変更する (2)submitボタンを押すと、次のWeb画面で選択した内容を表示する (1)については色々なところのサンプルコードを参考にしつつ、なんとか作成できました。 しかし、(2)は値の受け渡しがうまく出来ずに頭を抱えています。 （unitの値もgroupの値も共に空欄が返ってくる） ◆(1)のコード： 例えばUnit1を選択すると、グループ１（１－１～１－４）が表示され、 Unit2を選択すると、グループ２（２－１～２－４）がセレクトメニューに表示されるというものです。 <TR><TD> <TD><B>Unit</B><BR> <select name="unit" onchange="groupSet()"> <option value="">－選んでください－</option> <option value="">Unit1</option> <option value="">Unit2</option> <option value="">Unit3</option> </select> <TD><B>Group</B><BR> <SELECT NAME="group"> <option value="">－選んでください－</option> <option value=""></option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <script> //グループ１の配列 var group1_list=new Array( "－選んでください－","１－１","１－２","１－３","１－４"); //グループ２の配列 var group2_list=new Array( "－選んでください－","２－１","３－２","３－３","３－４"); //グループ３の配列 var group3_list=new Array( "－選んでください－","４－１","４－２","４－３","４－４"); function buSet(){ //オプションタグを連続して書き換える for ( i=1; i<5; i++ ){ //選択分岐 switch (document.selbox.unit.selectedIndex){ case 0: document.selbox.bu.options[i].text="";break; case 1: document.selbox.bu.options[i].text=group1_list[i];break; case 2: document.selbox.bu.options[i].text=group2_list[i];break; case 3: document.selbox.bu.options[i].text=group3_list[i];break; } } document.selbox.bu.selectedIndex=0;} </script> ◆(2)のやりかた request.getParameter("unit")およびrequest.getParameter("group")で値を取得し、 画面への表示＆ファイルへの保存を行っていますが、選択したgroup○○○の項目ではなく、空欄を取得しているようなのです・・・ どなたか知恵を貸してください。よろしくお願いします。
- ベストアンサー
- JavaScript
お礼
度々ありがとうございます。 なるほど、納得できました。 こうすれば第二セレクトで値を切り分けて 取得できるんですね。 思いっきり初歩的な勘違いして考えていました。(-_-;) 本当に助かりました。 ありがとうございました。