- 締切済み
セレクト文
下記のセレクト文に配列をセットしたいのですが、”onchange”を使った２段階？にするとエラーになってしまいます。 <html> <head> <body> <?php $selected[] = array(); unset($selected); $selected[$***[ "t" ][ "VALUE" = "SELECTED"; print("<select name=\"t\" onchange="if(t.value==1){s1.style.display='inline';s2.style.display='none'; }else{s1.style.display='none';s2.style.display='inline';}">") print("<option selected> print("<option value=1>1 print("<option value=2>2 print("<</select> $selected[] = array(); unset($selected); $selected[$***[ "s1" ][ "VALUE" ]] = "SELECTED"; print("<select name=\"s1\" style=display:none>") print("<option value=a>a") print("<option value=aa>aa") print("</select>") $selected[] = array(); unset($selected); $selected[$***[ "s2" ][ "VALUE" ]] = "SELECTED"; <select name=\"s2\" style=display:none>") <option value=b>b") <option value=bb>bb") print("</select>") ?> </body> </head> </html> よろしくお願いします。
- popoaja
- お礼率76% (10/13)
- PHP
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- yambejp
- ベストアンサー率51% (3827/7415)
>echoでくくるとonchangeの効果がなくなってしまうのでしょうか？ 今回の件は単純にクォーテーションをエスケープしてないからだと 思います。 ×echo("<select name=\"t\" onchange="changeFunc(this)">"); ○echo("<select name=\"t\" onchange=\"changeFunc(this)\">"); やはりヒアドキュメントなどをつかって、表示部分と処理部分を分けたほうが ボンミスが減るのでいいですよ。 <?php $shiyou = $_REQUEST[ "t" ]; $meter = $_REQUEST[ "METER" ]; if(isset($_REQUEST[ "s1" ])){ $meter = $_REQUEST[ "s1" ]; }else{ $meter = $_REQUEST[ "s2" ]; } $selected["t"][$maker["t"]["VALUE"]] =" SELECTED"; $selected["s1"][$kata["s1"]["VALUE"]] =" SELECTED"; $selected["s2"][$kata["s2"]["VALUE"]] =" SELECTED"; print <<<eof <html> <head> <script language="javascript"> function changeFunc(t){ var s1=t.form.s1; var s2=t.form.s2; switch(t.value){ case "1": s1.style.display='inline'; s2.style.display='none'; break; case "2": s1.style.display='none'; s2.style.display='inline'; break; default: s1.style.display='none'; s2.style.display='none'; } } window.onload=function(){ var obj=document.forms[0].elements["t"]; changeFunc(obj); } </script> </head> <body> <FORM ACTION="{$_SERVER['PHP_SELF']}" METHOD="POST" ENCTYPE="MULTIPART/FORM-DATA"> <select name="t" onchange="changeFunc(this)"> <option value=""></option> <OPTION VALUE="1"{$selected["t"]["1"]}>1</option> <OPTION VALUE="2"{$selected["t"]["2"]}>2</option> </select> <select name="s1" style="display:none"> <OPTION VALUE="aa"{$selected["s1"]["aa"]}>aa</option> <OPTION VALUE="aaa"{$selected["s1"]["aaa"]}>aaa</option> </select> <select name="s2" style="display:none"> <OPTION VALUE="bb"{$selected["s2"]["bb"]}>bb</option> <OPTION VALUE="bbb"{$selected["s2"]["bbb"]}>bbb</option> </select> <p> <INPUT TYPE="SUBMIT" NAME="SUBMIT" VALUE="登 録"> </p> </form> </body> </html> eof; ?>
- yambejp
- ベストアンサー率51% (3827/7415)
PHP的にもJavascript的にもHTML的にもなんかぼろぼろで、 一つ一つ整理していった方がよいですね。 こんかいそもそもPHPが必要なのでしょうか？ ざっと見た感じこんな感じのHTMLですみますが・・・ <html> <head> <script language="javascript"> function changeFunc(t){ var s1=t.form.s1; var s2=t.form.s2; if(t.value==1){ s1.style.display='inline'; s2.style.display='none'; }else{ s1.style.display='none'; s2.style.display='inline'; } } </script> </head> <body> <form> <select name="t" onchange="changeFunc(this)"> <option selected> <option value=1>1 <option value=2>2 </select> <select name="s1" style="display:none"> <option value=a>a <option value=aa>aa </select> <select name="s2" style="display:none"> <option value=b>b <option value=bb>bb </select> </form> </body> </html>
補足
すみません。たしかにボロボロでした。 教えていただいた記述で再度ためしてみたのですが、エラーになってしまいます。 エラー箇所は 『echo("<select name=\"t\" onchange="changeFunc(this)">");』 の所です。echoでくくるとonchangeの効果がなくなってしまうのでしょうか？おかしいところがあれば教えて下さい。よろしくお願いします。 <?php $shiyou = $_REQUEST[ "t" ]; $meter = $_REQUEST[ "METER" ]; if(isset($_REQUEST[ "s1" ])){ $meter = $_REQUEST[ "s1" ]; }else{ $meter = $_REQUEST[ "s2" ]; } ?> <html> <head> <script language="javascript"> function changeFunc(t){ var s1=t.form.s1; var s2=t.form.s2; if(t.value==1){ s1.style.display='inline'; s2.style.display='none'; }else{ s1.style.display='none'; s2.style.display='inline'; } } </script> </head> <body> <FORM ACTION="<?php echo( $_SERVER[ "PHP_SELF" ] ) ?>" METHOD="POST" ENCTYPE="MULTIPART/FORM-DATA"> <?php $selected[] = array(); unset($selected); $selected[$maker[ "t" ][ "VALUE" ]] = "SELECTED"; echo("<select name=\"t\" onchange="changeFunc(this)">"); echo("<option selected>"); echo("<OPTION VALUE=\"1\"" . $selected["1"] . ">1"); echo("<OPTION VALUE=\"2\"" . $selected["2"] . ">2"); echo("</select>"); $selected[] = array(); unset($selected); $selected[$kata[ "s1" ][ "VALUE" ]] = "SELECTED"; echo("<select name=\"s1\" style="display:none">"); echo("<OPTION VALUE=\"aa\"" . $selected["aa"] . ">aaa"); echo("<OPTION VALUE=\"aaa\"" . $selected["aaa"] . ">aaa"); echo("</select>"); $selected[] = array(); unset($selected); $selected[$kata[ "s2" ][ "VALUE" ]] = "SELECTED"; echo("<select name=\"s2\" style="display:none">"); echo("<OPTION VALUE=\"b\"" . $selected["b"] . ">b"); echo("<OPTION VALUE=\"bb\"" . $selected["bb"] . ">bb"); echo("</select>"); ?> </form> <p> <INPUT TYPE="SUBMIT" NAME="SUBMIT" VALUE="登 録"> </p> </body> </html>
関連するQ&A
- IDをvalueの値でなく、class名から取得したい
HTML上でvalue値を日本語にしてスマートに値を取得したいため、 value値でなくclass名でidnameに引き渡したいです。 (value)を(className)にしてみる等試行錯誤してみましたが どうやら見当違いのようです。お知恵を拝借したく思います。 <html> <head> <TITLE>Webサイト</TITLE> <STYLE TYPE="text/css"> <!-- .secondpulldown {display: none;} --> </STYLE> </head> <body> <script type="text/javascript"> function waySelect() { document.getElementById('select01').style.display = 'none'; document.getElementById('select02').style.display = 'none'; document.getElementById('select03').style.display = 'none'; } function SetSubMenu( idname ) { waySelect(); if( idname != "" ) { document.getElementById(idname).style.display = 'inline'; } } </script> <select name="oya" id="hiragana" onchange="SetSubMenu(value);"> <!--ここを(className)にするのは見当違いですか？）--> <option value="select01" class="select01">あいう</option> <option value="select02" class="select02">えおか</option> <option value="select03" class="select03">きくけ</option> </select> <!-- *------下に出現------* --> <br> <br> <select id="select01" class="secondpulldown" onchange="text01(this);"> <option value="0" selected>選択して下さい</option> <option value="1">ああああ</option> <option value="2">いいいい</option> <option value="3">うううう</option> </select> <select id="select02" class="secondpulldown" onchange="test(this);"> <option value="0" selected>選択して下さい</option> <option value="1">ええええ</option> <option value="2">おおおお</option> <option value="3">かかかか</option> </select> <select id="select03" class="secondpulldown" onchange="test(this);"> <option value="0" selected>選択して下さい</option> <option value="1">きききき</option> <option value="2">くくくく</option> <option value="3">けけけけ</option> </select>
- ベストアンサー
- JavaScript
- セレクトボックスについて
<script type="text/javascript"> function entryChange(){ if(document.getElementById('changeSelect')){ id = document.getElementById('changeSelect').value; if(id == '0'){ document.getElementById('selectbox1').style.display = "none"; document.getElementById('selectbox2').style.display = "none"; document.getElementById('selectbox3').style.display = "none"; } if(id == '1'){ document.getElementById('selectbox1').style.display = ""; document.getElementById('selectbox2').style.display = "none"; document.getElementById('selectbox3').style.display = "none"; } if(id == '2'){ document.getElementById('selectbox1').style.display = "none"; document.getElementById('selectbox2').style.display = ""; document.getElementById('selectbox3').style.display = "none"; } if(id == '3'){ document.getElementById('selectbox1').style.display = "none"; document.getElementById('selectbox2').style.display = "none"; document.getElementById('selectbox3').style.display = ""; } } } window.onload = entryChange; </script> ↑こちらは表示/非表示の処理をしています。 <select id="changeSelect" name="number" onchange="entryChange();"> <option value="0">未選択</option> <option value="1">リスト1</option> <option value="2">リスト2</option> <option value="3">リスト3</option> </select> <select name="number" id="selectbox1" style="display:none"> <option value="東京都">東京都</option> <option value="京都府">京都府</option> </select> <select name="number" id="selectbox2" style="display:none"> <option value="北海道">北海道</option> <option value="沖縄県">沖縄県</option> </select> <select name="number" id="selectbox3" STYLE="display:none"> <option value="兵庫県">兵庫県</option> <option value="大阪府">大阪府</option> </select> <input type="submit" value="送信"> (1)「未選択」のまま送信すると「大阪府」が送信されます。 (2)「リスト1」→「沖縄県」を選択 「大阪府」が送信されます。(リスト2も同じ事になります。) (3)「リスト3」→「兵庫県」を選択 「兵庫県」と送信されます。 リスト3以外を選択するとなぜか「大阪府」が送信されます。 初心者なりに色々調べたのですが解決できず困っております。 よろしくお願いします。
- 締切済み
- HTML
- JavaScriptで項目入力の制限分岐の仕方
WEBアンケートフォームを作る際、JavaScriptで項目入力の制限分岐の仕方を教えてください WEBアンケートフォームを作ろうとしているのですが、条件がいくつかありうまく作れません。 どなたかこの様な条件分岐でうまくいく方法をご存知の方、あるいは例がのっているWEBチュートリアルのページをご存知の方いらっしゃいませんか？ 【以下、作りたいフォームの項目】 選択肢Ａ～Ｅ（ラジオボタンによる選択）とプルダウンメニュー、テキストボックス入力フィールドがある。 --------------- Ａ プルダウンメニュー Ｂ Ｃ Ｄ Ｅ テキストボックス --------------- テキストボックスはグレーアウトでデフォルトは入力不可になっている。 プルダウンメニューもデフォルトでは選択ができないようになっている。 Ａを選んだらプルダウンメニューが選択可。 Ｃ、Ｄ、Ｅを選んだら、テキストボックスが入力可能になる。 ■■■ いろいろOK Wave内を調べたり、ググって調べて以下のようなソースを書いてみたのですが、 FireFoxやGoogleCromeだとうまく動きません。 これを動かせるようにしていただいても、助かります。 <input type="radio" name="radio1" value="ＡＡＡ" id="r1" checked onclick="this.form.select1.style.display='inline';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r1">ＡＡＡ</label><select name="select1" style="display='inline'"><option value="" selected> ------------- </option><option value="１１１">１１１</option><option value="２２２">２２２</option><option value="３３３">３３３</option><option value="４４４">４４４</option><option value="５５５">５５５</option><option value="６６６">６６６</option><option value="７７７">７７７</option><option value="８８８">８８８</option><option value="９９９">９９９</option></select><br /><input type="radio" name="radio1" value="ＢＢＢ" id="r2" onclick="this.form.select2.style.display='inline';this.form.select1.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r2">ＢＢＢ</label><input name="select2" style="display='none'"><br /><input type="radio" name="radio1" value="ＣＣＣ" id="r3" onclick="this.form.select3.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r3">ＣＣＣ</label><input name="select3" style="display='none'"><br /><input type="radio" name="radio1" value="ＤＤＤ" id="r4" onclick="this.form.select4.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select5.style.display='none'"><label for="r4">ＤＤＤ</label><input name="select4" style="display='none'"><br /><input type="radio" name="radio1" value="ＥＥＥ" id="r5" onclick="this.form.select5.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none'"><label for="r5">ＥＥＥ</label><input name="select5" style="display='none'"> ■■■ よろしくお願いします。
- 締切済み
- JavaScript
- セレクトボックスの中を一部隠したい ( IE )
セレクトボックスの中を一部隠したいのですが、IEでは隠れてくれません。firefoxなどでは、ちゃんと隠れるのですが、IEではどのようにすれば隠れるのでしょうか？ （例） 以下のセレクトボックスで、0・１のみ表示されるようにしたいです。 <select name="s" id="s"> <option value="0" name="s[0]" id="s[0]" >0</option> <option value="1" name="s[1]" id="s[1]" >1</option> <option value="2" name="s[2]" id="s[2]" style="display:none;">2</option> </select> また、javascriptで隠した部分を表示・非表示したいのですが、あわせて教えていただけないでしょうか。 firefox など、では以下で変化があるのですが、 document.getElementById('s[2]').style.display='block'; //表示 document.getElementById('s[2]').style.display='none'; //非表示 IE ではうんともすんともいってくれません・・・ document.all('s[2]').style.display='block'; //表示 document.all('s[2]').style.display='none'; //非表示 ちなみにテスト環境はIE7になります、よろしくお願いいたします。
- ベストアンサー
- HTML
- プルダウンをもう一つ増やしたい＆フレームページで使用のため、別ウインドウで表示させたい
↓他サイトさんにてサンプルで置いてあったものを拝借して自分なりにやってみました。 １、これをさらにもうひとつプルダウンを選択させて他サイトへジャンプさせる場合はどのようにしたらよいですか。 ２、フレームページで使うので、他サイトの表示を別ウインドウで表示させたいのですが、どのようにしたらよいですか。 よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http:///www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title></title> <script type="text/javascript" language="JavaScript"> <!-- function showthis(obj) { if(!obj) return false; if(document.getElementById) { document.getElementById("item1").style.display = "none"; document.getElementById("item2").style.display = "none"; document.getElementById("item3").style.display = "none"; document.getElementById(obj).style.display = "inline"; } else { return false; } } // --> </script> <style type="text/css"> #item1,#item2,#item3 { display: none; } </style> </head> <body> <form> <select onchange="showthis(this.value)"> <option selected="selected">選んでください</option> <option value="item1"></option> <option value="item2"></option> <option value="item3"></option> </select> <select id="item1" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item2" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item3" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> </form> </body> </html>
- ベストアンサー
- JavaScript
- DOCTYPE宣言とjavascript
United Statesを選んだ場合、州を選択。 それ以外の国の場合はtextフィールドで県なりを直接書き込む と言うようにしたく、下記の様にページを作成したのですが、 IE、Opera、Safariなど他では全て動作したのですが、 Firefoxのみ動作しませんでした。 但し、DOCTYPE宣言の"http://www.w3.org/TR/html4/loose.dtd" を削除したらFirefoxでも動作しました。 ただ、ここを削除すると全体的にデザインがズレてしまいます。 Firefoxでも動くようにjavascriptの部分を変更すると言う事で解決したいのですが、 良い書き方が解りません。どなたかご教授願えますでしょうか？ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <body> <script type="text/javascript"> function changeField(){ index= test_form.country.value; if (index != "UnitedStates"){ document.getElementById("select1").style.display="inline"; document.getElementById("select1").disabled=false; document.getElementById("select2").style.display="none"; document.getElementById("select2").disabled=true; } else { document.getElementById("select1").style.display="none"; document.getElementById("select1").disabled=true; document.getElementById("select2").style.display="inline"; document.getElementById("select2").disabled=false; } } </script> <form name="test_form"> <select name="country" onChange="changeField()"> <option value="Japan" selected="selected">Japan</option> <option value="UnitedStates">United States</option> </select> <input id="select1" name="state" type="text" size="20" /> <select id="select2" name="state" style="display:none" disabled> <option value="CA">California</option> <option value="CO">Colorado</option> <option value="CT">Connecticut</option> </select> </form> </div> </body> </html>
- ベストアンサー
- JavaScript
- <SELECT>タグでの selectを→間違い
<SELECT>タグでの selectを初めに表示させたいのですが、 できますでしょうか。 先の質問、文を間違えました、すいません。 訂正します。 ｃが選択状態で、何も表示されず、 以下のｂを選べば、２が表示されますが、 何も選んでいないとき、ｃを選択した状態で、 ３を表示させておきたいのですが 可能でしょうか。 onloadで、読みだす方法とかで可能なのでしょうか。 よろしくおねがいいたします。 <p> <form name="test"> <select name="linkselect" onChange="n()"> <option value="">選択して下さい</option> <option value="1">a</option> <option value="2">b</option> <option value="3"selected>c</option> </select> </form> </p>
- ベストアンサー
- JavaScript
- ページが切り替わるスクリプトで最初から指定のページを表示させる
<html> <head> <script type="text/javascript" language="JavaScript"> <!-- JavaScript小技集 2005. 6.17 function showthis(obj) { if(!obj) return false; if(document.getElementById) { document.getElementById("item1").style.display = "none"; document.getElementById("item2").style.display = "none"; document.getElementById("item3").style.display = "none"; document.getElementById(obj).style.display = "block"; } else { return false; } } // --> </script> <style type="text/css"> #item1,#item2,#item3 { display: none; } </style> </head> <body> <form> <select onchange="showthis(this.value)"> <option selected="selected">記事を選ぶ</option> <option value="item1">記事１</option> <option value="item2">記事２</option> <option value="item3">記事３</option> </select> </form> </body> <html> これなんですが、これを貼ってあるページを読み込んだ際、最初からitem1を表示した状態にしたいのですが どうすればよいのでしょう？
- 締切済み
- Java
- セレクトメニューでレイヤーの切り替え
<html> <head> <title>実験用</title> </head> <script language="javascript"> <!-- function sel(flg){ flg.style.display = "block"; } //--> </script> <body> <select onChange="sel(this.value)"> <option value="aaa">その１ <option value="bbb">その２ </select> <div id="aaa" style="display:none;background:skyblue">ああああああああああああああ</div> <div id="bbb" style="display:none;background:skyblue">いいいいいいいいいいいいいい</div> </body> </html> このスクリプトは動かないのですが、イメージとしては セレクトメニューで選んだら、それに対応したレイヤーを 表示させたり、非表示にしたりしたいのです。 環境はWinXP,IE6とMac9.2.2,IE5.1です。 何かいい方法は無いでしょうか。
- ベストアンサー
- JavaScript
- セレクトメニューのリセットについて
<select name="Q1_VALUE"> <option value="1" selected >AAAA</option> <option value="2" selected >BBBB</option> <option value="3" >CCCC</option> <option value="4" >DDDD</option> </select> <select name="Q2_VALUE"> <option value="1" selected >1111</option> <option value="2" >2222</option> <option value="3" >3333</option> </select> 上記セレクトメニューでQ1_VALUEの選択肢を変更した場合Q2_VALUEの選択肢をデフォルトに戻す方法を教えて下さい。
- ベストアンサー
- JavaScript
補足
バッチリです。ありがとう御座います。 これが、３つとか４つの分岐になった場合もこの方法で良いのでしょうか？本当に申し訳ないのですが、その場合も教えて頂けないでしょうか、よろしくお願いします。