- 締切済み
ラジオボタンと連動させたいです
3つのラジオボタンとその右側に3つのテキストの枠があるとします。 例として（(1)tel/(2)fax/(3)mail）いずれかのラジオボタンを選択して、それぞれの右側にあるテキスト枠に電話番号などを入力してもらうようにしたいのです。 そこで、何もラジオボタンを選択していない状態だと右側のテキスト枠すべてを灰色で表示させて入力できなくし、たとえばその3つの内の(2)faxのラジオボタンを選択するとその行の右側にあるテキスト枠が入力できるようにしたいのですがどのようにすればできますでしょうか。 わかりにくい表現ですが宜しくお願いします。
- japex2
- お礼率31% (14/45)
- ホームページ作成ソフト
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- UsadaYusuke
- ベストアンサー率43% (55/126)
>javascriptを<head>内で記入しますとOCNが提供しているCGIのformmail(OCN独自のCGI)が機能しなくなりました。 本当にそれが問題でしょうか。 <form>タグの属性や値(actionとかmethodとか)、または必要な<input type="hidden" ..>などが足りなかったりはしないでしょうか。 ↓OCNのformmailを利用するのに入力画面に必要な、formやinputの属性やその値などは下記URLに説明があります。
- hinatamama
- ベストアンサー率58% (70/120)
> そこでこちらのjavascriptを<body>内にすべて記述することは、可能なのでしょうか？ 可能ですよ。 <form>より上に<script>～</script>までを記述するだけです。
- UsadaYusuke
- ベストアンサー率43% (55/126)
・初期状態ではtext部品に「disabled」属性を設定しておく ・ラジオボタンがクリックされたことを(onclickで)感知してJavaScriptコードを実行させる ・JavaScriptでtext部品のdisabledプロパティの値(true/false)をいじくって切り替える という手順で実現できます。 言葉で説明するのは難しいので以下のコードを見て(分からなければ解説本などを引きながら)動作を追ってみてください。 * * * 以下、サンプルコード <html> <head> <script type="text/javascript"> <!-- function my_toggle(my_obj){ document.forms[0].tel_ban.disabled = true; document.forms[0].fax_ban.disabled = true; document.forms[0].mail_add.disabled = true; my_obj.disabled = false; } //--> </script> </head> <body> <form> <input type="radio" name="renraku" value="tel" onclick="my_toggle(document.forms[0].tel_ban);">tel<input type="text" name="tel_ban" disabled><br> <input type="radio" name="renraku" value="fax" onclick="my_toggle(document.forms[0].fax_ban);">fax<input type="text" name="fax_ban" disabled><br> <input type="radio" name="renraku" value="mail" onclick="my_toggle(document.forms[0].mail_add);">mail<input type="text" name="mail_add" disabled><br> <form> </body> </html>
お礼
ありがとうございます。こちで動作確認できました。しかし１つ問題がでまして、javascriptを<head>内で記入しますとOCNが提供しているCGIのformmail(OCN独自のCGI)が機能しなくなりました。そこでこちらのjavascriptを<body>内にすべて記述することは、可能なのでしょうか？ ちなみにOCNのレンタルサーバーを使用しておりプランを上げるとお客様独自のCGIを設置することが出来ますとのことですが、私自身そのような知識がありませんので宜しくお願いします。
お礼
><form>タグの属性や値(actionとかmethodとか)、または必要な<input type="hidden" ..>などが足りなかったりはしないでしょうか。 その辺は大丈夫だと思います。教えていただいたjavascriptを外せばformmailは機能します。