締切済み

複数のプルダウンメニューをチェックボックスのオンオフで使用不可あるいは使用可にする方法

2006/06/11 00:07

こんにちは。質問があります。一つのチェックボックスと5つのプルダウンメニューがあるとします。チェックボックスをオンにすると5つのプルダウンメニュー全てが使用不可になります。チェックボックスをオフにするとプルダウンメニュー全てが使用可になります。このような動作は可能なのでしょうか？よろしくお願いします。

kamakuragengorou
お礼率53% (132/248)

JavaScript
回答数2
ありがとう数0

みんなの回答 （2）
専門家の回答

みんなの回答

yambejp
ベストアンサー率51% (3827/7415)

2006/06/11 13:15 回答No.2

#1さんの考え方で基本的に問題ないのですが、 selectの名前づけ方に制限ができてしまうので若干改良してform内のすべてのselectの使用可を制御する前提で、以下のようにするとよいかと思います。全てではなく一部のselectを変更したいと言う場合はclass等をつかって切り分けることもできます。（もちろんnameで切り分けてもかまいません） <html> <head> <script language="javascript"> function on_off(obj){ var f=obj.form for(var i=0;i<f.length;i++){ if(f[i].type=="select-one") f[i].disabled = obj.checked; } } </script> </head> <body> <form> <input type="checkbox" onclick="on_off(this)"> <select name="select1"> <option value="select1_value1">1-1</option> </select> <select name="select2"> <option value="select2_value1">2-1</option> </select> <select name="select3"> <option value="select3_value1">3-1</option> </select> <select name="select4"> <option value="select4_value1">4-1</option> </select> <select name="select5"> <option value="select5_value1">5-1</option> </select> </form> </body> </html>

ログインすると、全ての回答が全文表示されます。

BLUEPIXY
ベストアンサー率50% (3003/5914)

2006/06/11 02:49 回答No.1

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>Sample</title> <script type="text/javascript"> </script> </head> <body> <form name="FORM1"> <input type="checkbox" name="check1" value="check1" checked onclick="on_off(this)"> <select name="select1"> <option value="select1_value1">1-1</option> </select> <select name="select2"> <option value="select2_value1">2-1</option> </select> <select name="select3"> <option value="select3_value1">3-1</option> </select> <select name="select4"> <option value="select4_value1">4-1</option> </select> <select name="select5"> <option value="select5_value1">5-1</option> </select> </form> </body> </html>

ログインすると、全ての回答が全文表示されます。