AKB48の推しメンをセンターにできちゃうかもしれない!? >>

文末ソースの通り (1) 分類グループ、(2) すいかグループ、(3) 色グループ
というフォーム類があります。

これを次のような法則性でdisable/enableを切り替えたいです。
(1) 初期値で、「すいかグループ」と「色グループ」はdisabled。
(2) 「果物」がONの間だけ「すいかグループ」がenable(初期値で「含む」をON)
  ここで「色グループ」はまだdisabledのまま。
(3) 「除く」がONの時のみ、「色グループ」もenable。他の「含む」「のみ」を選択中、
 「色グループ」は常にdisabled。
(4) 「色グループ」が一つ以上チェックされている間、「分類グループ」の
  「肉」「魚」「穀物」「飲料」はdisabled。
  「色グループ」がdisableである間、「肉」~「飲料」は常にenable。

昨日も類似質問nご教示いただき(解決済み)、
本件に応用を試みましたが、(4) でつまづきました。

よろしくお願い致します

<html>
<head></head>
<body>
<form>
■分類<br>
<input type="checkbox" name="category[]">果物
(■すいか
<input type="radio" name="suika" disabled checked>含む
<input type="radio" name="suika" disabled>除く
<input type="radio" name="suika" disabled>のみ)<br>
<input type="checkbox" name="category[]">肉<br>
<input type="checkbox" name="category[]">魚<br>
<input type="checkbox" name="category[]">穀物<br>
<input type="checkbox" name="category[]">飲料<br>
<br>■色<br>
<input type="checkbox" name="color[]" disabled>赤<br>
<input type="checkbox" name="color[]" disabled>黄<br>
<input type="checkbox" name="color[]" disabled>青<br>
<input type="checkbox" name="color[]" disabled>白<br>
</form>
</body>
</html>

A 回答 (1件)

あまり複雑な条件はつけすぎるとろくなことがないです。


もう少し、トリガーと結果を調整した方がよいかも知れません。
この手の複数のオブジェクトの属性を調整する場合は
nameだとcgiなどへの影響もあるでしょから
以前申し上げたとおりclassで管理するとよいでしょう。

<html>
<head>
<script language="javascript">
function classDisable(f,cn,fl){
for (var i=0;i<f.elements.length;i++){
if(f.elements[i].className==cn){f.elements[i].disabled=fl}
}
}
function classCheck(f,cn){
for (var i=0;i<f.elements.length;i++){
if(f.elements[i].className==cn && f.elements[i].checked==true && f.elements[i].disabled==false){return true;}
}
return false;
}
</script>
</head>
<body>
<form>
■分類<br>
<input type="checkbox" name="category[]" onClick="classDisable(this.form,'suika',!this.checked);classDisable(this.form,'color',!(!this.form.suika[1].disabled && this.form.suika[1].checked));classDisable(this.form,'nofruit',classCheck(this.form,'color'));">果物
(■すいか
<input type="radio" name="suika" class="suika" disabled onClick="classDisable(this.form,'color',this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'color'));" checked>含む
<input type="radio" name="suika" class="suika" disabled onClick="classDisable(this.form,'color',!this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'color'));">除く
<input type="radio" name="suika" class="suika" disabled onClick="classDisable(this.form,'color',this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'color'));">のみ)<br>
<input type="checkbox" name="category[]" class="nofruit">肉<br>
<input type="checkbox" name="category[]" class="nofruit">魚<br>
<input type="checkbox" name="category[]" class="nofruit">穀物<br>
<input type="checkbox" name="category[]" class="nofruit">飲料<br>
<br>■色<br>
<input type="checkbox" name="color[]" class="color" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">赤<br>
<input type="checkbox" name="color[]" class="color" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">黄<br>
<input type="checkbox" name="color[]" class="color" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">青<br>
<input type="checkbox" name="color[]" class="color" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">白<br>
</form>
</body>
</html>
    • good
    • 0
この回答へのお礼

yambejpさん、いつも厚かましい質問に
懇切丁寧にご教示くださいまして、
本当に感謝に耐えません。

わたしも、もう少しシンプルにならないものかと
考え抜いたのですが、一番分かりやすく間違い
ないのが質問の仕様かな・・と思いました。

おかげさまで、本当に助かりました。
重ねて御礼申し上げます。

お礼日時:2005/11/11 12:42

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qdisable時の背景色(HTML)

チェックボックスをdisabledで非活性にしたときの背景色の設定はできないのでしょうか?

また、チェックボックスをリードオンリーにすることはできますか?
WEBではできると書いてありますが、実際に試してみるとうまくいきません。

要はチェックボックスが変更不能でかつ見えやすくしたいのです。

何か方法があれば教えてください。

Aベストアンサー

CSS3のセレクタであるdisabledで、disabled時のスタイルを指定できます。

E:disabled
{
background:#fff;
}

ただし、対応しているブラウザが少ない(Firefox1.5〈Gecko1.8〉以上で対応。IE7β2及びOpera8.54は非対応)ので、まだ一般に使用できる段階にはないといえます。

なお、チェックボックスをreadonlyにすることは出来ないかと。
>readonly (readonly) #IMPLIED -- for text and passwd --

Qチェックボックスの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以外のブラウザでも動作できると大変助かります.よろしくお願い致します.

下記の動作をする 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 ty...続きを読む

Aベストアンサー

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>

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" ...続きを読む

QSQLで特定の項目の重複のみを排除した全項目を取得する方法

私は仕事上でデータベースを扱っていて、タイトルのような処理を行う必要があるのですが、いかんせん方法がわからずネット上を検索しても同様だったためここで質問させていただきます。

質問点を簡単に説明いたしますと、
たとえばAというテーブルがあって、

項目名1 項目名2 項目名3 項目名4
 A    あ    ア    亜
 A    い    ア    以
 A    う    ア    宇
 B    え    イ    江
 B    お    イ    尾

上のような構造になっている場合に「項目名1」について重複している項目を排除し、結果として


項目名1 項目名2 項目名3 項目名4
 A    あ    ア    亜
 B    え    イ    江

上のようなデータを取得したいのです。
この時に、Aの重複を排除して取得するレコードは1~3行目のどれでもよいです。
また、データを取得する際には必ずそのレコードの「全項目」を取得したいのでDistinctはうまく使えませんでした。

どなたか詳しい方、方法を教えてくださると幸いです。回答お待ちしております。

私は仕事上でデータベースを扱っていて、タイトルのような処理を行う必要があるのですが、いかんせん方法がわからずネット上を検索しても同様だったためここで質問させていただきます。

質問点を簡単に説明いたしますと、
たとえばAというテーブルがあって、

項目名1 項目名2 項目名3 項目名4
 A    あ    ア    亜
 A    い    ア    以
 A    う    ア    宇
 B    え    イ    江
 B    お    イ    尾

上のよ...続きを読む

Aベストアンサー

比較可能で一意性のある値をもてる項目6をテーブルに追加して、

select T.* from T, (select Item1,min(Item6) as Item6 from T group by item1) W where T.item6=W.item6;

――ってやるのが、一番手っ取り早いと思います。
他のところに影響がでないのであればですが。
oracleならrowidを使うとか、レコードの更新時刻を突っ込むとか。

QチェックボックスのON/OFFに応じて別の複数のチェックボックスも連動ON/OFF

7番のcheckboxをON→1,2,4,5番にチェックもON
7番のcheckboxをOFF→1,2,4,5番にチェックもOFF

という風に動作させる記述をご教示ください。
よろしくお願い致します。


<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
<form action="" method="post" name="myform">
去年<br>
1番<input type="checkbox" name="kyonen[]" value="1">1月<br>
2番<input type="checkbox" name="kyonen[]" value="2">2月<br>
3番<input type="checkbox" name="kyonen[]" value="3">3月<br>
今年<br>
4番<input type="checkbox" name="kotosi[]" value="1">1月<br>
5番<input type="checkbox" name="kotosi[]" value="2">2月<br>
6番<input type="checkbox" name="kotosi[]" value="3">3月<br>
7番<input type="checkbox" name="mychk">去年と今年の1、2月をまとめてチェック<br>
</form>
</body>
</html>

7番のcheckboxをON→1,2,4,5番にチェックもON
7番のcheckboxをOFF→1,2,4,5番にチェックもOFF

という風に動作させる記述をご教示ください。
よろしくお願い致します。


<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
<form action="" method="post" name="myform">
去年<br>
1番<input type="checkbox" name="kyonen[]" value="1">1月<br>
2番<input type="checkbox" name="kyonen[]" value="2">2月<br>
3番<input type="checkbox" name="kyonen[]" value="3">3月<br...続きを読む

Aベストアンサー

条件が複雑になるともう少し工夫が必要になりますが、
とりあえずはこんな感じでいけると思います。

<html>
<head>
<script type="text/javascript">
function checkFunc(obj){
f=obj.form
for(var i=0;i<f.length;i++){
if((f[i].name=="kyonen[]" || f[i].name=="kotosi[]")&& (f[i].value=="1" ||f[i].value=="2")) f[i].checked=obj.checked
}
}
</script>
</head>
<body>
<form action="" method="post" name="myform">
去年<br>
1番<input type="checkbox" name="kyonen[]" value="1">1月<br>
2番<input type="checkbox" name="kyonen[]" value="2">2月<br>
3番<input type="checkbox" name="kyonen[]" value="3">3月<br>
今年<br>
4番<input type="checkbox" name="kotosi[]" value="1">1月<br>
5番<input type="checkbox" name="kotosi[]" value="2">2月<br>
6番<input type="checkbox" name="kotosi[]" value="3">3月<br>
7番<input type="checkbox" name="mychk" onClick="checkFunc(this)">去年と今年の1、2月をまとめてチェック<br>
</form>
</body>
</html>

条件が複雑になるともう少し工夫が必要になりますが、
とりあえずはこんな感じでいけると思います。

<html>
<head>
<script type="text/javascript">
function checkFunc(obj){
f=obj.form
for(var i=0;i<f.length;i++){
if((f[i].name=="kyonen[]" || f[i].name=="kotosi[]")&& (f[i].value=="1" ||f[i].value=="2")) f[i].checked=obj.checked
}
}
</script>
</head>
<body>
<form action="" method="post" name="myform">
去年<br>
1番<input type="checkbox" name="kyonen[]" value="1">1月...続きを読む

Qフォーム内checkboxのチェック可・不可の切替

お問い合わせフォームを作ろうと思っております。
その中で、一方のチェックボックスにチェックを入れると、別のチェックボックスが入力不可になるような動作のものをjavascriptにて作りたいのですが、どうも上手くいかずにおります。。

具体的には、下記のような内容のものを作ろうと思っています。
http://www.gazo.cc/up/19941.jpg

Q.1ですが、(1)、(2)それぞれの選択1・選択2は同時にチェックする事はできないようにしたいです。
ただし、『(1)の選択1・(2)の選択2』また『(1)の選択2、(2)の選択1』という組み合わせのチェックは可能です。

Q.2ですが、特に無しを選択すると、選択1、選択2、選択3はチェックする事はできないようにしたいです。
また可能でしたら、下にある、2箇所テキスト入力部分は、選択3が選択されないと入力不可の状態にしたいと思っています。


ご回答の程、よろしくお願い致します。

Aベストアンサー

チェックボックスにdisabledという属性を設定すれば入力不可にできるので、
onclickイベントで希望の処理をすればいいと思います。

とても簡単に書くと
<html>
<body>
<form name="f1">
選択1<input type="checkbox" name="chk1" onClick="document.f1.chk2.disabled = this.checked;">
選択2<input type="checkbox" name="chk2" onClick="document.f1.chk1.disabled = this.checked;">
</form>
</body>
</html>
としておけば、選択1をチェックしたら選択2は入力不可になります。

あくまでもサンプルですので、参考までに。

Qテキストボックスの入力をリセット

ボタンが押されたら、テキストボックスの入力内容を削除するにはどうしたらいいでしょうか?

Aベストアンサー

こんな感じ。

<form>
<input type=button value="clear" onClick="this.form.t.value = ''">
<input type=text size=50 name=t>
</form>

ボタンの this.form.t の t が、テキストの名前になっていて、押されると
空の文字列を入れる、だけです。

もし、フォーム全体のテキストをクリアするならば、こんな方法もあります。

<form>
<input type=button value="clear" onClick="this.form.reset()">
<input type=text size=50 name=t1>
<input type=text size=50 name=t2>
<input type=text size=50 name=t3>
</form>

QJSP + ラジオボタン

JSP+Servlet+Beanで作ってます。
JBuilder5を使ってます。

JSPはラジオボタン、テキスト、ボタン等があります。
<INPUT TYPE = "radio" NAME = "r1" VALUE = "ins">A
<INPUT TYPE = "radio" NAME = "r1" VALUE = "upd">B
<INPUT TYPE = "radio" NAME = "r1" VALUE = "del">C

としています。
たとえば、Bを選択時、ボタンクリックで
Servletにリクエストを送信しますが、
Servletから再びJSPを呼び出し、画面を
表示するとき、ラジオボタンはBを選択
させたいのですが、どうしたらいいですか?
FormタグのCHECKEDというオプションを
どのように使えばいいのか教えていただきたいのですが。


テキストには、Beanでsetメソッド、
JSPでは、<jsp:getProperty・・・>を使って
セットできているんですが、ラジオボタンも
同様ですか?
@@@・・・JSPのタグを勉強しないといけないです。
@@@勉強不足です。

JSP+Servlet+Beanで作ってます。
JBuilder5を使ってます。

JSPはラジオボタン、テキスト、ボタン等があります。
<INPUT TYPE = "radio" NAME = "r1" VALUE = "ins">A
<INPUT TYPE = "radio" NAME = "r1" VALUE = "upd">B
<INPUT TYPE = "radio" NAME = "r1" VALUE = "del">C

としています。
たとえば、Bを選択時、ボタンクリックで
Servletにリクエストを送信しますが、
Servletから再びJSPを呼び出し、画面を
表示するとき、ラジオボタンはBを選択
させたいの...続きを読む

Aベストアンサー

<% %>のなかに
<jsp:getProperty name="wk" property="aaa" />
のようなJSPタグを使用することはできません。
これはエラーになります。

wkがBeanのインスタンス名、aaaがプロパティ名なので
<% if(wk.getAaa()==1){ out.print("checked");} %>

でよいと思いますが・・・

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

QHTMLファイル同士での値渡し

困っています。

HTMLファイルからHTMLファイルへ移動するときに、
HTMLファイル1でJavaScript で算出された値を
HTMLファイル2へ渡して使用したいのです。

showModalDialogだとダイアログにしか渡せないし・・・。
このように、値をそのまま次のページに渡すための方法を教えてください。
お願いします。

Aベストアンサー

すみません。うっかりしてました。

document.write(FORM[v1]);
では、v1を変数と認識してしまうので、エラーになってしまいますね。

document.write(FORM.v1);  // 「FORM.v1」です
あるいは
document.write(FORM["v1"]);
としてください。

Q