プルダウンのコントロールに関して

質問

教えて下さい。

画面上にプルダウンを設け、選択させるようにしたいと考えていますが、
その際に、ある選択肢が選ばれた時だけ、隣にテキストボックスを表示させたいと
考えています。

どのような記述をすれば良いでしょうか？

サンプルのようものを教えて頂ければ幸いです。

よろしくお願いします。

回答No.1

yambejp

たとえば基本的に隠しておいて、任意のデータが選ばれた時だけ
表示をすればいいのでは？

styleを直接いじってもいいし、class名を調整するのでいいでしょう

たとえばhogeの2を選んだとき、fugaが表示されるのならこんな感じ
なお表示しないものをサブミットしたくないならdisableを調整する必要があります

<style>
input.hide {display:none;}
</style>
<script>
function display_fuga(){
var hoge=document.getElementById("hoge");
var fuga=document.getElementById("fuga");
var reg=/(^| )hide( |$)/;
var c=fuga.className.replace(reg,"");
var v=hoge.options[hoge.selectedIndex].value;
fuga.className=c+(v!="2"?((c==""?"":" ")+"hide"):"");
}
</script>
<form>
<p>
<select name="hoge" id="hoge" onchange="display_fuga()">
<option value="">-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="text" name="fuga" id="fuga" class="hide">
</p>
</form>