- ベストアンサー
javascript歴 2ヶ月
プログラミング初心者です。 javascriptファイルとhtmlファイルを分けて 記述しているのですが、 性別が男か女かというラジオボタンと「実行」 というボタンとひとつのテキストボックスを 作成し、どちらかをクリックし実行ボタンをクリック すると選択されたラジオボタンのvalueプロパティがテキス トボックスに表示されるというプログラムを作っています。 しかし! 初期表示を女にしたいので、 <input type="radio" checked name="rdo1" value="女" onClick="rdo_Change(this)">女 としたのですが、これで動かしてもうまくいかず、 テキストボックスにはundefinedと表示されます。 ぜひ、正しい書き方を教えていただけないでしょうか。 あと、チェックボックスにチェックがひとつもない場合 アラートで"ひとつ以上選択してください"という記述例 もお願いします。 どうかお願いいたします(泣)
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>rdo_Change</title> <script type="text/javascript"> function rdo_Change(e){ /* var f = e.form var f1 = document.f alert(e.value)//男/女(クリックしたラジオボタンで変化する) alert(f.name)//f alert(f.name)//f(f==f1) alert(f.rdo1[0].value)//女 alert(f.rdo1[1].value)//男 alert(f.text.value)//lll このようなことから f.rdo1[0] = フォーム内の1つ目のinput f.rdo1[1] = フォーム内の2つ目のinput f.text=フォーム内の3つ目のinput(これがvalueを設定する対象) クリックされた要素のvalueはe.valueで参照できる。 チェックは外れないかもしれません。 */ f.text.value = e.value;//最終的にこれだけかも・・・ } </script> </head> <body> <form name="f" action="javascript:void(0)" method="GET"> <input type="radio" name="rdo1" value="女" onClick="rdo_Change(this)" checked>女 <input type="radio" name="rdo1" value="男" onClick="rdo_Change(this)">男 <input type="text" name="text" value="lll"> </form> </body> </html>
その他の回答 (1)
- leap_day
- ベストアンサー率60% (338/561)
こんにちは 質問内容の通りに作るとこんな感じになります <script language="javascript"> <!-- function change() { if(document.form.sex[0].checked == false && document.form.sex[1].checked == false) { alert("性別を選択してください") } for(i=0;i<2;i++){ if(document.form.sex[i].checked) { document.form.result.value = document.form.sex[i].value; } } } //--> </script> <form name="form"> <input type="radio" name="sex" value="男">男 <input type="radio" name="sex" value="女">女 <br> <input type="button" value="実行" onClick="change()"> <P> <input type="text" name="result" value="女" size="6"> </form>
お礼
すごくわかりやすい説明で、 とても助かりました。 ありがとうございました。
お礼
大変助かりました。 詳しい解答ほんとにありがとうございます。