こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

チェックボックスのON/OFFに連動してラジオボタンのdisabledを解除

下記の動作をする checkfunc(); の書き方をご教示ください.


<html>
<head>
<script type="text/javascript">
checkfunc()
</script>
</head>
<body>
<form name="myform">
<input type="checkbox" name="yesno" value="1">チェックボックス
<input type="radio" name="rdo1" value="0">ラジオボタン0
<input type="radio" name="rdo1" value="1">ラジオボタン1
<input type="radio" name="rdo1" value="2">ラジオボタン2
<input type="radio" name="rdo1" value="3">ラジオボタン3
<input type="radio" name="rdo1" value="4">ラジオボタン4
</form>
</body>
</html>

(1) このHTMLのラジオボタン5つは,最初は全てdisabledです.
(2) チェックボックスがされたらラジオボタングループが有効になるようにしたいです.
(3) 逆に,チェックが外れたらラジオボタンはdisabledに戻ります.
(4) このjavascriptは,PHPファイルに組み込みますが.表示時にDBを読み込んでどれに
 チェック/選択されていたかによって,checkboxやradioに「checked」を追記します.
 その場合,enabled/disablesの関係に矛盾がないようにもしたいですが,
 <body>に onload="checkfunc();" と入れればいいでしょうか?

なお,IE以外のブラウザでも動作できると大変助かります.よろしくお願い致します.

投稿日時 - 2007-01-24 13:51:43

QNo.2692133

暇なときに回答ください

質問者が選んだベストアンサー

litton101 さん、こんにちは。

さて litton101 さんのスクリプト、以下のように修正させていただきました。お試しあれ。

<html>
<head>
<script type="text/javascript">
function checkfunc() {

for(i=0; i<5; i++) {

document.myform.rdo1[i].disabled = !(document.myform.yesno.checked);

}

}
</script>
</head>
<body onLoad="checkfunc();">
<form name="myform">
<input type="checkbox" name="yesno" value="1" onClick="checkfunc();">チェックボックス
<input type="radio" name="rdo1" value="0">ラジオボタン0
<input type="radio" name="rdo1" value="1">ラジオボタン1
<input type="radio" name="rdo1" value="2">ラジオボタン2
<input type="radio" name="rdo1" value="3">ラジオボタン3
<input type="radio" name="rdo1" value="4">ラジオボタン4
</form>
</body>
</html>

投稿日時 - 2007-01-24 16:23:09

お礼

hkd9001さん,
迅速かつ完璧な(!)ご回答ありがとうございました,早速組み込んで大変快適です.
実は,途中まで解決できていたのですが,途中で挫折していました.
でも,ご提示いただいたScriptで,おかげさまで,解決しました.
本当にありがとうございました.



自己レス,もったいないので(?!)掲示しますね・・
------------

元質問者です,過去質問を応用したら,ON/OFFに応じたdisabledは実現できました…
http://oshiete1.goo.ne.jp/qa1768091.html

が,「更新(F5)」ボタンを押したり,
PHPでDBに登録してある値に応じてHTML表示時にラジオボタンにチェックしたり
などの動作を加えると,既定で追加されている「disabled」が効いてしまい,
「チェックは入っているのにdisabled」状態になってしまいます.
この点,何とかならないでしょうか?よろしくお願い致します.


(1) checkfuncを追加
(2) チェックボックスに, onclick="checkfunc(this);"を追加
(3) 各ラジオボタンに,「class="rdo1" disabled」を追加


<html>
<head>
<script type="text/javascript">
function checkfunc(f) {
for(var i=0; i<f.form.length; i++){
if (f.form.elements[i].className == "rdo1") {
f.form.elements[i].disabled = !f.checked;
}
}
}
</script>
</head>
<body>
<form name="myform">
<input type="checkbox" name="yesno" value="1" onclick="checkfunc(this);">チェックボックス
<input type="radio" name="rdo1" value="0" class="rdo1" disabled>ラジオボタン0
<input type="radio" name="rdo1" value="1" class="rdo1" disabled>ラジオボタン1
<input type="radio" name="rdo1" value="2" class="rdo1" disabled>ラジオボタン2
<input type="radio" name="rdo1" value="3" class="rdo1" disabled>ラジオボタン3
<input type="radio" name="rdo1" value="4" class="rdo1" disabled>ラジオボタン4
</form>
</body>
</html>

投稿日時 - 2007-01-24 17:24:15

ANo.1

このQ&Aは役に立ちましたか?

2人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問