ラジオボタンの無効について
-
0 名前： 水無月 ： 2005/08/05 19:35
- 初めて質問させていただきます、水無月と申します。
私は現在自分の所属するサークルのホームページを作っているのですが、メールフォームを利用して閲覧者との交流の場を設けたいと考えています。
内容は以下のとおりです。
１.送信の種類の選択→『見学希望』か『質問・意見・感想など』
２.『見学希望』の際に『性別』と『年代』と『見学希望日』の項目を入力
３.『見学希望』および『質問・意見・感想など』の際に『名前』と『題名』と『本文』と『メールアドレス』と『返事の有無』の項目を入力
そして一度作って表示させてみたのですが、いまいち自分でも使いづらかったので修正したいのです。
修正内容は以下のとおりです。
１.送信の種類の選択をラジオボタン形式にする
２.『見学希望』を選択したときには上記の内容の２の項目を有効にして、『質問・意見・感想など』を選択したときには無効にする
<body onload="radioChange()">
<script>function radioChange(){if(document.mail.item[0].checked==true){document.mail.sex.disabled=false}else if(document.mail.item[1].checked==true){document.mail.sex.disabled=true}}</script>
<form name="mail">
送信の種類<br>
<input name="item" type="radio" value="1" onclick="radioChange()">見学希望<br>
<input name="item" type="radio" value="0" onclick="radioChange()">質問・意見・感想など<br>
性別<br>
<input name="sex" type="radio">男性<br>
<input name="sex" type="radio">女性<br>
</form>
</body>
一部省略していますが、基本的にはこのような感じで作りました。
選択はプルダウンメニューではなくラジオボタンで作りたく、手元にあったJavaScriptの本を見て作ったのですがうまく動作しません。
どうすれば動作するようになるでしょうか？
また、そもそもJavaScriptではこのような動作はできないのでしょうか？
よろしくお願いします。
-
1 名前： ぱげ ： 2005/08/05 19:35
- <body onload="radioChange">
<body onload="radioChange()">
> 選択はプルダウンメニューではなくラジオボタンで作りたく、
> 手元にあったJavaScriptの本を見て作ったのですがうまく動作しません。
<select name="sex">
<option>男性</option>
<option>女性</option>
</select>
<input name="sex" type="radio">男性<br>
<input name="sex" type="radio">女性<br>
HTMLソースに書く name="sex" が増えた。
<input name="item" type="radio" value="1" onclick="radioChange()">見学希望<br>
<input name="item" type="radio" value="0" onclick="radioChange()">質問・意見・感想など<br>
document.mail.item[0]
複数の name="item" から一つを参照する時には、[0] や [1] と書いている。
ふつう気付くだろ……。
-
2 名前： m035 ： 2005/08/05 19:35 ［URL］
- <body onload="radioChange()">
<script>function radioChange(){if(document.mail.item[0].checked==true){document.mail.sex.disabled=false}else if(document.mail.item[1].checked==true){document.mail.sex.disabled=true}}</script>
↑
typeが無いです。これではJavaScriptかどうかさえも、ブラウザには理解できません。
<script type="text/javascript">
とすべきです。
また、<script>から</script>までは<head>と</head>の間に書きます。
そのほか多数の間違いがあります。
よって、正しくは
<html>
<head>
<script type="text/javascript">
<!--
var sw=0;
function radioChange(){
if(sw==0){
document.mail.sex[0].disabled=false;
document.mail.sex[1].disabled=false;
}
else{
document.mail.sex[0].disabled=true;
document.mail.sex[1].disabled=true;
}
}
//-->
</script>
</head>
<body onload="radioChange()">
<form name="mail">
送信の種類<br>
<input name="item" type="radio" onclick="sw=0;radioChange()" checked>見学希望<br>
<input name="item" type="radio" onclick="sw=1;radioChange()">質問・意見・感想など<br>
性別<br>
<input name="sex" type="radio" checked>男性<br>
<input name="sex" type="radio">女性<br>
</form>
</body>
</html>
といった感じになります。
もう少し、基本的なところを勉強したほうがいいです。
http://www.tohoho-web.com/js/index.htm
などに行ってみてください。
