会員登録を"する"にした場合のみ、会員登録フォームが有効になる。
ホームページのurlは"持っている"場合のみ入力可能になる。
名前が未入力の場合、[送信]ボタンは機能しない。
フォームのdisabled属性
Sample Source......................................................................>>>
<SCRIPT language="JavaScript"><!--
function RegistON(){ //会員登録する場合
for(i=2;i<document.form1.elements.length;i++){
document.form1.elements[i].disabled = false; //全てのﾌｫｰﾑ要素を有効に
}
//url入力欄と[送信]ﾎﾞﾀﾝだけは無効にしておく
document.form1.url.disabled = true;
document.form1.submit.disabled = true;
}
function RegistOFF(){ //会員登録しない場合
for(i=2;i<document.form1.elements.length;i++){
document.form1.elements[i].disabled = true; //全てのﾌｫｰﾑ要素を無効に
}
}
function CheckTxt(txt){ //名前欄が入力されているかどうかﾁｪｯｸする
if(txt == "")document.form1.submit.disabled = true;
else document.form1.submit.disabled = false;
} function YesNo(yn){ //同意するかどうかの確認、同意しないと送信できない if(yn == "no")document.form1.submit.disabled = true; else document.form1.submit.disabled = false; }
//--></SCRIPT>
</head>
<body onload="RegistOFF()">
<form name="form1">
会員登録を････
<input type="radio" name="reg" onclick="RegistON()">する／
<input type="radio" name="reg" onclick="RegistOFF()" checked>しない
<fieldset style="border:double blue;background-color:mistyrose;">
<legend style="color:red;font:16;">会員登録フォーム</legend>
●名前は：
<input type="text" name="username" size="12" onBlur="CheckTxt(this.value)">
●性別は：
<input type="radio" name="sex" value="man" checked>男
<input type="radio" name="sex" value="fe">女
<input type="radio" name="sex" value="??">不明
●興味のあるジャンルを２つまで選択
<input type="checkbox" name="ch1">ﾚｼﾞｬｰ
<input type="checkbox" name="ch2">ｽﾎﾟｰﾂ
<input type="checkbox" name="ch3">音楽
<input type="checkbox" name="ch4">演芸
<input type="checkbox" name="ch5">文芸
<input type="checkbox" name="ch6">政治
<input type="checkbox" name="ch7">経済
<input type="checkbox" name="ch8">ｲﾝﾀｰﾈｯﾄ
<input type="checkbox" name="ch9">ﾊﾟｿｺﾝ
<input type="checkbox" name="ch10">旅行
●自分のﾎｰﾑﾍﾟｰｼﾞを持っていますか？･･･
<input type="radio" name="hp" value="yes" onclick="document.form1.url.disabled=false">
持っている
<input type="radio" name="hp" value="no" checked onclick="document.form1.url.disabled=true">
持っていない
持っている場合、urlは･･･
<input type="text" name="url" size="60" value="http://">
<p align="center">以上の内容に････ <br> <input type="radio" name="yesno" onclick="YesNo('no')"> 同意しない <br> <input type="radio" name="yesno" checked onclick="YesNo('yes')"> 同意する <input type="submit" name="submit" value="送信" onclick="alert('Sampleテストのため、実際には何も送信しません。')">
</fieldset>
</form>