14歳の自分に衝撃の事実を告げてください

こんばんは。いつもお世話になっております。
随分前になりますが、こちらでご指導いただいた内容を元に、タイトルにある、グループ別けされたチェックボックス郡の選択および解除をしたいと考えているのですが、お恥ずかしながら、思うような結果を得る事が出来ません。
お忙しい中恐縮ですが、ご指導いただきたく投函させて頂きます。

※グループ単位で選択or解除をしたい
□カテゴリ(すべて選択or解除)
□1 □2 □3 □4 □5

□タイプ
□1 □2 □3 □4 □5

文字数制限に引っかかってしまったので、javascpipt部は非表示にいたします。

<input type="checkbox" onclick="CheckAlt(this)">
<div id="category">
<input type="checkbox" name="category[]" value="1">
<input type="checkbox" name="category[]" value="2">
<input type="checkbox" name="category[]" value="3">
<input type="checkbox" name="category[]" value="4">
<input type="checkbox" name="category[]" value="5">
</div>

<input type="checkbox" onclick="CheckAlt(this)">
<div id="type">
<input type="checkbox" name="type[]" value="1">
<input type="checkbox" name="type[]" value="2">
<input type="checkbox" name="type[]" value="3">
<input type="checkbox" name="type[]" value="4">
<input type="checkbox" name="type[]" value="5">
</div>

A 回答 (2件)

<form>


<p><input type="checkbox" onclick="CheckAlt(this)"></p>
<div>
<input type="checkbox" name="category[]" value="1">
<input type="checkbox" name="category[]" value="2">
<input type="checkbox" name="category[]" value="3">
<input type="checkbox" name="category[]" value="4">
<input type="checkbox" name="category[]" value="5">
</div>
<p><input type="checkbox" onclick="CheckAlt(this)"></p>
<div>
<input type="checkbox" name="type[]" value="1">
<input type="checkbox" name="type[]" value="2">
<input type="checkbox" name="type[]" value="3">
<input type="checkbox" name="type[]" value="4">
<input type="checkbox" name="type[]" value="5">
</div>
</form>

面倒ですからこのようにHTMLを書いたら如何でしょうか
そうすると

Form = document.getElementsByTagName('form')[0]
P = Form.getElementsByTagName('p')
DIV = Form.getElementsByTagName('div')
for(i=0;i<P.length;i++){
Pinput = P[i].getElementsByTagName('input')[0]
DIVinput = DIV[i].getElementsByTagName('input')
if(Pinput.checked){for(k=0;k<DIVinput.length;k++){DIVinput[k].checked=true}}
else{for(k=0;k<DIVinput.length;k++){DIVinput[k].checked=false}}
}
こんな感じになるんでしょうかね。
Pは他のタグでも良いです。
早い話,フォーム内の要素を参照できれば良いですよね。

他にも
formsやelementsなどを使っても出きるとおもいます。
やり方は検索してください。
    • good
    • 0
この回答へのお礼

al785z29さま

はじめまして、こんばんは。
コードまで記述していただき、またポイントなど教えていただき有難う御座います!
で、早速試したところ、思い描いていた結果を返す事ができました!
言葉足らずなご挨拶ではありますが、ご親切な対応に感謝しております。有難う御座いました。

お礼日時:2006/12/03 23:03

思うような結果とは?


Javascript部のソースと共に補足をお願いします。
    • good
    • 0
この回答へのお礼

steel_grayさま

はじめまして、こんばんは。早速のお返事を有難うございます。
お恥ずかしいながら、JavaScriptのソースは以下のようになっており、(これでも)考えながら試行錯誤を繰り返しているところです。

<SCRIPT language="JavaScript">
<!--
function CheckAlt(oAlt) {
var bCheck = oAlt.checked;
var oInputs = document.getElementById("category").getElementsByTagName("input");
for (var i = 0; i < oInputs.length; i++) {
if (oInputs[i].getAttribute("type") == "checkbox") {
oInputs[i].checked = bCheck;
}
}
var bCheck = oAlt.checked;
var oInputs = document.getElementById("type").getElementsByTagName("input");
for (var i = 0; i < oInputs.length; i++) {
if (oInputs[i].getAttribute("type") == "checkbox") {
oInputs[i].checked = bCheck;
}
}
}
//-->
</SCRIPT>

ちなみに、描いている結果とは、
□カテゴリ(すべて選択or解除)
□1 □2 □3 □4 □5

□タイプ
□1 □2 □3 □4 □5

の。一番最初のカテゴリをチェック(または解除)する事でその直下にある1~5までのチェック(または解除)を入れ、
3行目のタイプにチェックを入れることで、その下段にある1~5までのチェックを入れたいと考えています。

お礼日時:2006/12/03 21:58

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


おすすめ情報