同時に２つの動作をさせるための条件式と記述方法は？
- １つの条件式で同時に２つの動作をさせるためには、どのように記述すれば良いのでしょうか？
- 具体的な例として、セレクトメニューの表示と選択valueの変更を同時に行いたい場合、条件式内でそれぞれの操作を行う記述が必要です。
- 条件式内で、先のセレクトメニューの表示と選択valueの変更を行うためには、それぞれのセレクトメニューに対して適切な命令を書き加える必要があります。
- ベストアンサー
１つの条件式で同時に２つの動作をさせたい
お世話になります。 １つの条件式で同時に２つの動作をさせるためには、どのように記述すれば良いのでしょうか？ 例として if(str == 1){document.form.A.style.visibility = "visible"; for (i=0; i<menuItem[0].length; i++) { document.form.A.options[i] = new Option(menuItem[0][i],menuItem[0][i]); } ｝ と言う、セレクトメニューを表示して任意の選択valueを組み込む記述があります。 これに、同じ条件の時(str == 1)に、同時にもう１つの別の場所のセレクトメニュー {document.form.B.style.visibility = "visible"; for (i=0; i<menuItem[1].length; i++) { document.form.B.options[i] = new Option(menuItem[1][i],menuItem[1][i]); } } の表示・選択valueの変更をさせたいのですが、どのような記述にしたら よろしいのでしょうか？ よろしくお願い致します。
- hage_1000
- お礼率89% (34/38)
- JavaScript
- 回答数1
- ありがとう数6
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
『同時に』というのが、どのレベルでの同時性を求めているの かがわかりませんが、単純に考えれば if 文の中にふたつとも 入れれば良いのでは？ if (str == 1) { // Aに関する処理 document.form.A.style.visibility = "visible"; for (i=0; i<menuItem[0].length; i++) { document.form.A.options[i] = new Option(menuItem[0][i],menuItem[0][i]); } // Bに関する処理 document.form.B.style.visibility = "visible"; for (i=0; i<menuItem[1].length; i++) { document.form.B.options[i] = new Option(menuItem[1][i],menuItem[1][i]); } ｝
関連するQ&A
- セレクトメニュー連動のテキストをクリアにしたい
下記のサンプルがあります。 <html> <head> <title>form TEST</title> <script> <!-- menuItem = [["－選んで下さい－","いち","に","さん"], ["－選んで下さい－","ひい","ふう","み"], ["－選んで下さい－","もの","じ","とり"]]; function check(){ len = document.form.three.options.length; for (i=0; i<len; i++){ document.form.three.options[i] = null; } n = document.form.one.value; if(n == "1"){document.form.three.style.visibility = "visible"; for (i=0; i<menuItem[0].length; i++){ document.form.three.options[i] = new Option(menuItem[0][i],menuItem[0][i]); } }else if(n == "2"){document.form.three.style.visibility = "visible"; for (i=0; i<menuItem[1].length; i++){ document.form.three.options[i] = new Option(menuItem[1][i],menuItem[1][i]); } }else if(n == "3"){document.form.three.style.visibility = "visible"; for (i=0; i<menuItem[2].length; i++){ document.form.three.options[i] = new Option(menuItem[2][i],menuItem[2][i]); } } } msgtxt = new Array(); for (i=0; i<3; i++){msgtxt[i] = new Array(); } msgtxt[0][0] =" "; msgtxt[0][1] ="あいうえお"; msgtxt[0][2] ="かきくけこ"; msgtxt[0][3] ="さしすせそ"; msgtxt[1][0] =" "; msgtxt[1][1] ="たちつてと"; msgtxt[1][2] ="なにぬねの"; msgtxt[1][3] ="はひふへほ"; msgtxt[2][0] =" "; msgtxt[2][1] ="まみむめも"; msgtxt[2][2] ="やゆよ"; msgtxt[2][3] ="わゐうゑを"; function txtchg(){ x = document.form.two.selectedIndex; y = document.form.three.selectedIndex; document.form.four.value = msgtxt[x][y]; } // --> </script> </head> <body onLoad="check()"> <form name= "form"> Value１ <select name="one" onchange="check()"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> Value２ <select name="two" onchange="check()"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> Value３ <select name="three" style="visibility:hidden" onchange="txtchg()"> </select> Value４ <textarea name="four" rows="1" cols="10"></textarea> </form> </body> </html> これは、Value1の選択値によってValue3の選択肢を変えて、Value2とValue3の選択値の組み合わせの結果をValue4に記入するという動作のサンプルです。 でもこれですと、Value2とValue3の結果でValue４に記入された後に、Value1やValue2を変更した場合、Value3は初期値に戻るのですが、Value4はそのまま表示されたままになってしまいます。本当はValue3が初期値に戻ったのだから、その場合はValue4をクリアにしたいのですが。 どこをどう修正すればその動作が可能になるのか、ご教示お願い致します。
- ベストアンサー
- JavaScript
- セレクトメニューからもう一つのセレクトメニューを選択したか確認
「ブロック名」のセレクトメニューを選択すると、選択した項目によってもう一つ「部署名」のセレクトメニューが出て選択するようにしました。 送信前に「ブロック名」だけでなく、「部署名」も選択したかそうか確認したのですが、どうしでも出来ません。 いろいろ試しても出来なくて困っています。 ぜひ教えてください。 よろしくお願いいたします。 ---------------------------------------------------------------- menuItem =[[" "], ["(2) 部署を選択 ","あああ","いいい"], ["(2) 部署を選択 ","ううう","えええ"], ["(2) 部署を選択 ","おおお","かかか"], ["(2) 部署を選択 ","ききき","くくく"]]; 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="AREA" onchange="setMenuItem(this.selectedIndex)" style="color : #3d3d3d;"> <OPTION value="0" selected>(1) ブロックを選択 </OPTION> <OPTION value="Ａブロック">Ａブロック</OPTION> <OPTION value="Ｂブロック">Ｂブロック</OPTION> <OPTION value="Ｃブロック">Ｃブロック</OPTION> <OPTION value="Ｄブロック">Ｄブロック</OPTION> </SELECT> <SELECT size="1" name="BUSYO" style="color : #3d3d3d;visibility : hidden;"> <OPTION selected value="0"></OPTION> </SELECT> ---------------------------------------------------------------- 確認用 if(document.form2.AREA.value=="0"){ alert("ブロックを選択してください"); return false; } return true; }
- 締切済み
- 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
- 複数のセレクトメニューを制御するとき・・・
どなたかお手すきでしたら、稚拙な質問にお付き合いお願い致します。 ネットで探した方法で、セレクトメニュー１の項目を選択したときにセレクトメニュー２の項目を変化させる制御をしています。 このフォームでDBにvalue値（1,2など数値で）を送信するようにしたいのですが この方法ですとセレクトメニュー２のvalue値が0（NULL）となってしまい上手く送信できません。 配列に文字列を入れていますし、DBの型をintにしているので0になってしまっていると思うのですが、 文字列としては送信したくはありません。 どのような方法でしたら文字列ではなく、上手くvalueに数値を入れることが出来るでしょうか。 どうかよろしくおねがいします。 以下使用しているコードです。 <html> <head> <title>テストテスト</title> <script language="JavaScript"><!-- menuItem = [ [], ["あああ","あああ２","あああ３","あああ４","あああ５"], ["いいい"], ["ううう","ううう２"], ["えええ","えええ２","えええ３","えええ４"] ]; function clearOption(len){ var i; for (i=0; i<len; i++){ document.aaa.bbb.options[i] = null; } } function setMenuItem(n){ optlen = document.aaa.bbb.options.length; while(optlen > 0){ clearOption(optlen); optlen = document.aaa.bbb.options.length; } if (menuItem[n].length > 0){ for (i=0; i<menuItem[n].length; i++){ document.aaa.bbb.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } } } // --></script> </head> <body> <form name="aaa"> <select name="Maker" onChange="setMenuItem(this.selectedIndex)"> <option value="" selected>--- 選択してください ---</option> <option value="1">ひとつ</option> <option value="2">ふたつ</option> <option value="3">みっつ</option> <option value="4">よっつ</option> </select> <select name="bbb"> <option value="" selected>--- 選択してください ---</option> </select> </form> </body> </html>
- ベストアンサー
- JavaScript
- セレクトメニューの4連動
いつも参考にさせて頂いております。 javascript初心者です。 現在、javascriptにてセレクトメニューの4連動を作成しているのですが、4つ目のセレクトメニューを正常に動かすことが出来ません・・・。何とか3つまでは動くようになったのですが・・・。忙しいところを申し訳ありませんが、教えて下さい。 一つ目のセレクトで、地域の選択 二つ目のセレクトで、県の選択 三つ目のセレクトで、「プレイスポット」か「食事」の選択 四つ目のセレクトでは、 プレイスポット名(三つ目でプレイスポット選択時) お店名(三つ目で食事選択時) 上記したようにしたいのです。宜しくお願いします。 <html> <head> <script type="text/javascript"> <!-- var area=0; function setA(n) { aa=n; data1 = [ ["東京","神奈川"], ["大阪","神戸"], ]; len = document.form1.box_a.options.length; for(i=len-1; i>0; --i) document.form1.box_a.options[i] = null; if(n!=0) { document.form1.box_a.style.visibility = "visible"; for(i=0; i<data1[n-1].length; i++) document.form1.box_a.options[i+1] = new Option(data1[n-1][i]); } setB(0); } function setB(n) { data2 = [ [["プレイスポット","食事"],["プレイスポット","食事"]], [["プレイスポット","食事"],["プレイスポット","食事"]] ]; len = document.form1.box_b.options.length; for(i=len-1; i>0; --i) document.form1.box_b.options[i] = null; if(n==0)return; document.form1.box_b.style.visibility = "visible"; for(i=0; i<data2[aa-1][n-1].length; i++) document.form1.box_b.options[i+1] = new Option(data2[aa-1][n-1][i]); setC(0); } function setC(n) { data3 = [ [[["としまえん","よみうりランド"],["キハチ","久兵衛"]]], [[["江ノ島","鎌倉"],["カレーミュージアム","中華街"]]], [[["ユニバーサルスタジオ","天王寺動物園"],["かに道楽","金龍ラーメン"]]], [[["須磨海浜水族園","グリコピア"],["コンチェルト","六甲山牧場"]]] ]; len = document.form1.box_c.options.length; for(i=len-1; i>0; --i) document.form1.box_c.options[i] = null; if(n==0)return; document.form1.box_c.style.visibility = "visible"; for(i=0; i<data3[aa-1][n-1][n-1].length; i++) document.form1.box_c.options[i+1] = new Option(data3[aa-1][n-1][n-1][i]); } //--> </script> </head> <body> <form name="form1"> <select name="sel1" onChange="setA(this.selectedIndex)"> <option value="0" selected>▼選択してください</option> <option value="1">関東</option> <option value="2">関西</option> </select> <select name="box_a" onChange="setB(this.selectedIndex)"><option value="0" selected>---------------</option></select> <select name="box_b" onChange="setC(this.selectedIndex)"><option value="0" selected>---------------</option></select> <select name="box_c" onChange=""><option value="0" selected>---------------</option></select> </form> </body> </html>
- 締切済み
- JavaScript
- 条件の値を他のページのテキストボックスから送る
str = document.form.yy.value; if(str == 00){document.form.xx.style.visibility = "visible"; }else {document.form.xx.style.visibility = "hidden"; } と言う条件式があります。 上記の「00」の部分を別のページから変更することってできるのでしょうか？ 例えば、別のページのテキストボックスに「01」と入力して、「送信ボタン」 とかをクリックすると、上記の(str == 00)の部分が(str == 01)になる ようにしたいのですが。。。 サンプルコードがあると助かります。よろしくお願いいたします。
- ベストアンサー
- JavaScript
- 2番目のセレクトメニュー選択項目に応じてリンク先を変えたい
説明が下手糞な事お許し下さい。 javaを使ったセレクトメニューをウェブサイトに導入しようと、ネットで調べ、試行錯誤を繰り返し、大雑把な形は出来たのですが、やはりどうもうまくいきません。 やりたいことは、一つ目のセレクトメニュー（色）を選び、二つ目のセレクトメニュー（コンピューター）を選ぶと、個々に指定したアルファベットのリンクを表示したいのですが・・・ 以下のソースだと、初期状態では、ＡＢＣの3項目が最初から現れており、二つ目のセレクトメニューを選ぶと必ず、上段はＡ・中段はＢ・下段はＣと出てしまい、一つ目を選びなおすと前のリンクが残ったままになっております。 黒のmacを選ぶとＡを、 白のetcを選ぶとＡを、 赤のWindowsを選ぶとＣを、 といった感じで個々にリンク先を変えることができ、一つ目のセレクトメニューを選びなおすと前のリンク先の結果の表示が消える方法、初期状態でアルファベットのリンクを出さない方法は無いでしょうか？ ご存知の方、どうかアドバイスをお願い致します。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無題ドキュメント</title> <script language="JavaScript"><!-- menuItem = [ ["windows","mac","etc"], ["windows","mac","etc"], ["windows","mac","etc"], ]; function setMenuItem(n) { len = document.myForm.Computer.options.length; for (i=len-1; i>=0; i--) { document.myForm.Computer.options[i] = null; } for (i=0; i<menuItem[n].length; i++) { document.myForm.Computer.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } } function setTable(selOBJ) { for (i=1; i<=3; i++) { if (document.all) document.all["tbl"+i].style.visibility = "hidden"; if (document.layers) document.layers["tbl"+i].visibility = "hidden"; } n = selOBJ.selectedIndex + 1; if (document.all) document.all["tbl"+n].style.visibility = "visible"; if (document.layers) document.layers["tbl"+n].visibility = "visible"; } // --></script> </head> <body> <form name="myForm"> <select name="Maker" onChange="setMenuItem(this.selectedIndex)"> <option value="black">黒</option> <option value="white">白</option> <option value="red">赤</option> </select> <select name="Computer" onchange="setTable(this)"> <option value="windows">windows</option> <option value="mac">mac</option> <option value="etc">etc</option> </select> </form> <div id="tbl1" class="tbl"><a href="http://www.yahoo.co.jp/">A</a></div> <div id="tbl2" class="tbl"><a href="http://www.yahoo.co.jp/">B</a></div> <div id="tbl3" class="tbl"><a href="http://www.yahoo.co.jp/">C</a></div> </body> </html>
- ベストアンサー
- JavaScript
- セレクトメニューの連動、そしてページへのリンク
[セレクトメニューA] > [セレクトメニューB] > [セレクトメニューC] …というような、まずAで選び、それに対応したメニューBのうちのひとつを選び、そして最後にCのうちのひとつを選ぶと、 (たとえば、Cのセレクトメニューには Yahoo Google Excite のようなのがあり、それらを選択すると、) あらかじめ設定しておいた該当するページへ行く、というようなしくみはどのように作ればいいのでしょうか？ ネット上を探し回って、自分で組み立てて作ってみましたが、 <!-- menu = [ ["A","B","C","D"], ["E","F","G"], ["H"] ]; function setMenu(n) { len = document.myForm.sb.options.length; for (i=len-1; i>=0; i--) { document.myForm.sb.options[i] = null; } for (i=0; i<menu[n].length; i++) { document.myForm.sb.options[i] = new Option(menu[n][i],menu[n][i]); } } menuItem = [ ["Z"], ["Y","X","W","V"], ["U","T","S","R"] ]; function setMenuItem(a) { len = document.myForm.s.options.length; for (c=len-1; c>=0; c--) { document.myForm.s.options[c] = null; } for (c=0; c<menuItem[a].length; c++) { document.myForm.s.options[c] = new Option(menuItem[a][c],menuItem[a][c]); } } // --> ───────────────── <form name="myForm"> <select name="a" onchange="setMenu(this.selectedIndex)"> <option checked selected>セレクトA</option> <option value="A">A</option> <option value="E">E</option> <option value="H">H</option> </select> > <select name="sb" onchange="setMenuItem(this.selectedIndex)"> <option selected> </option> </select> > <select name="s" onChange="popJump(this)"> <option selected > </option> </select> </form> …と、３つを連動させるまでにはいたったのですが、最後の、「セレクトCを選んだときに該当ページへジャンプ」というのができません。 このプログラムにどのような修正を加えればよいのでしょうか？ よろしくお願いいたします。
- ベストアンサー
- JavaScript
- 複数のプルダウン
いつも参考にしております。 プルダウンが選択後、もうひとつのプルダウンを表示したいと 思っておりますが、うまく表示されません。 1つめのプルダウンの選択によって、2つめのプルダウンのメニューは 異なります。 <!-- function setArea(n) { prefItem = [["▼選択してください"], ["▼選択してください", "千葉県", "東京都", "神奈川県", "山梨県"], ["▼選択してください", "新潟県", "長野県", "富山県"], ["▼選択してください", "静岡県", "愛知県", "岐阜県", "三重県"], len = document.form1.PrefID.options.length; for (i=0; i<len; i++) { document.form1.PrefID.options[i] = null; } document.form1.PrefID.style.visibility = "visible"; for (i=0; i<prefItem[n].length; i++) { document.form1.PrefID.options[i] = new Option(prefItem[n][i]); } } //--> <select name="AreaID" onChange="setArea(this.selectedIndex)"> <option value="0" selected>▼選択してください</option> <option value="1">関東</option> <option value="2">甲信越・北陸</option> <option value="3">東海</option> </select> <select name="PrefID" style="visibility:hidden"> たとえば、1つめのプルダウンを「関東」を選択すると 2つめのプルダウンに「千葉県, 東京都, 神奈川県, 山梨県」 と表示されますが、その後「▼選択してください」を選択すると 「▼選択してください, 神奈川県」と2つのメニューが表示されてしまいます。 メニューを削除して、新しく生成しています。 なので、「▼選択してください」と1つだけのメニューになるはずだと思うのですが。 ご教授お願いいたします。
- ベストアンサー
- JavaScript
- ブラウザの戻るボタンを押したときのデータの保持の仕方
頻繁に書き込みして申し訳ありません。 どなたかお手すきでしたら、稚拙な質問にお付き合いお願い致します。 前回セレクトメニューについて教えて頂いたのですが、今回もセレクトメニューに関しての質問です。 ＩＥでの話なのですが、セレクトメニュー１・２を選択しsubmitボタンで次のページに行き、 ブラウザの戻るボタンで戻ってきたときにセレクトメニュー２の方のデータ（value）だけ保持できていません。 前にＩＥはそのような仕様だという話を聞いたのですが、その時もこちらで質問させてもらいました。 その時はselectタグにidを仕込んでおき、「window.onload」でgetElementByIdを使用するやり方を 教わったのですが、今回はそれでうまくいきません。 ネットで検索していてcookieを使用してデータを保持しておくというやり方も見かけたのですが、 一番効率のよいやり方はどのようなものになるのでしょうか。 どうかよろしくお願いします。 以下ソースとなります。 <html> <head> <title>テストテスト</title> <script language="JavaScript"><!-- menuItem = [ [ ], ["あああ","あああ２","あああ３","あああ４","あああ５"], ["いいい","いいい２"], ["ううう","ううう２","ううう３"], ["えええ","えええ２","えええ３","えええ４"] ]; function clearOption(len){ var i; for (i=0; i<len; i++){ document.aaa.bbb.options[i] = null; } } function setMenuItem(n){ optlen = document.aaa.bbb.options.length; while(optlen > 0){ clearOption(optlen); optlen = document.aaa.bbb.options.length; } if (menuItem[n].length > 0){ for (i=0; i<menuItem[n].length; i++){ document.aaa.bbb.options[i] = new Option(menuItem[n][i],menuItem[n][i]); for( j=1; j<=4; j++ ){ if( document.aaa.Maker.selectedIndex == [j] ){ document.aaa.bbb.options[i].value = i+([j]*10); } } } } } window.onload = function(){ setMenuItem(document.getElementById('q1').value); //alert(document.getElementById('q2').value); } // --></script> </head> <body> <form name="aaa" action="./next.html" method="POST"> <select name="Maker" id="q1" onChange="setMenuItem(this.selectedIndex)"> <option value="" selected>--- 選択してください ---</option> <option value="1">ひとつ</option> <option value="2">ふたつ</option> <option value="3">みっつ</option> <option value="4">よっつ</option> </select> <select name="bbb" id="q2"> <option value="" selected>--- 選択してください ---</option> </select> <input type="submit" name="ok" vakue="ok"> </form> </body> </html>
- ベストアンサー
- JavaScript
お礼
ありがとうございます。ちょっと難しく考え過ぎていました。 現在 script を勉強中で、良く見ると { や } の配列をみれば、連続して 書けるところでした。お手数お掛けしました。