- 締切済み
(続)ラジオボタンの選択でチェックボックスのON/OFFを連動
前回（http://okwave.jp/qa5476132.html）とは全く違うものを参考に作成してみましたが、「ラジオボタンを選択するたびにチェックボックスのチェックが初期化される」というのがまだ出来ておりません。 どなたか教えていただけるとありがたいです＞＜ <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="radio" value="アリ" name="fpcdata" class="fpcdata" onClick="classDisable(this.form,'Kind01',!this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'Kind01'));">アリ （ <input type="checkbox" value="DXF" name="Kind01[]" class="Kind01" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">DXF <input type="checkbox" value="ガーバ" name="Kind01[]" class="Kind01" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">ガーバ <input type="checkbox" value="PDF" name="Kind01[]" class="Kind01" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">PDF ） <input type="radio" value="ナシ" name="fpcdata" class="fpcdata" onClick="classDisable(this.form,'Kind01',this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'Kind01'));" checked>ナシ <input type="radio" value="相談" name="fpcdata" class="fpcdata" onClick="classDisable(this.form,'Kind01',this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'Kind01'));"> 相談 ■分類<br> <input type="radio" value="ナシ" name="print" class="print" onClick="classDisable(this.form,'Kind04',this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'Kind04'));" checked>ナシ <input type="radio" value="アリ" name="print" class="print" onClick="classDisable(this.form,'Kind04',!this.checked);classDisable(this.form,'nofruit',classCheck(this.form,'Kind04'));">アリ （ <input type="checkbox" value="銀シールド" name="Kind04[]" class="Kind04" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">銀シールド <input type="checkbox" value="銀ペースト" name="Kind04[]" class="Kind04" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">銀ペースト <input type="checkbox" value="銅ペースト" name="Kind04[]" class="Kind04" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">銅ペースト <input type="checkbox" value="シルク" name="Kind04[]" class="Kind04" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))">シルク 色 <SELECT name="Kind04[]" class="Kind04" disabled onClick="classDisable(this.form,'nofruit',classCheck(this.form,this.className))"> <OPTION SELECTED VALUE="---">--- <OPTION VALUE="白">白 <OPTION VALUE="黒">黒 <OPTION VALUE="他">他 </SELECT> ） </form> </body> </html>
- kuru1125
- お礼率100% (7/7)
- JavaScript
- 回答数3
- ありがとう数6
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- fujillin
- ベストアンサー率61% (1594/2576)
- yambejp
- ベストアンサー率51% (3827/7415)
シルクにチェックがあると色が選べる？？ <script> window.onload=function(){ var f0=document.getElementById("f0"); try{ f0.addEventListener("click",function(e){func(e)},true); }catch(e){ f0.attachEvent("onclick",function(e){func(e)}); } } function func(e){ var obj= (e.srcElement || e.target); if(obj.nodeName!="INPUT") return false; switch(obj.type){ case "radio": setRadio(obj); break; case "checkbox": setCheckbox(obj,"シルク","Kind04[]","SELECT"); break; } } function setRadio(obj){ var n=obj.parentNode.firstChild; while(n){ if(n.nodeName=="INPUT" && n.type=="checkbox"){ n.disabled=obj.value!="アリ"; n.checked=false; } if(n.nodeName=="SELECT"){ n.disabled=true; n.selectedIndex=0; } n=n.nextSibling; } } function setCheckbox(obj,v,n,nn){ if(obj.value!=v) return false; var node=obj.parentNode.firstChild; while(node){ if(node.nodeName==nn && node.name==n){ node.disabled=!obj.checked; node.selectedIndex=0; } node=node.nextSibling; } } </script> </head> <body> <form id="f0"> <fieldset> <legend>■分類</legend> <input type="radio" value="アリ" name="fpcdata" class="fpcdata">アリ （ <input type="checkbox" value="DXF" name="Kind01[]" class="Kind01" disabled>DXF <input type="checkbox" value="ガーバ" name="Kind01[]" class="Kind01" disabled>ガーバ <input type="checkbox" value="PDF" name="Kind01[]" class="Kind01" disabled>PDF ） <input type="radio" value="ナシ" name="fpcdata" class="fpcdata" checked>ナシ <input type="radio" value="相談" name="fpcdata" class="fpcdata"> 相談 </fieldset> <fieldset> <legend>■分類</legend> <input type="radio" value="ナシ" name="print" class="print" checked>ナシ <input type="radio" value="アリ" name="print" class="print" >アリ （ <input type="checkbox" value="銀シールド" name="Kind04[]" class="Kind04" disabled>銀シールド <input type="checkbox" value="銀ペースト" name="Kind04[]" class="Kind04" disabled>銀ペースト <input type="checkbox" value="銅ペースト" name="Kind04[]" class="Kind04" disabled>銅ペースト <input type="checkbox" value="シルク" name="Kind04[]" class="Kind04" disabled>シルク 色 <SELECT name="Kind04[]" class="Kind04" disabled> <OPTION SELECTED VALUE="---">--- <OPTION VALUE="白">白 <OPTION VALUE="黒">黒 <OPTION VALUE="他">他 </SELECT> ） </fieldset> </form> </body> </html>
お礼
丁寧に教えていただき有難うございました。 早速ソースコードを拝見し、使用させていただきました。 また、何かございましたら宜しくお願いいたします＞＜
- potluckker
- ベストアンサー率55% (22/40)
本当にざらっと見ただけですが 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 classDisable(f,cn,fl){ for (var i=0;i<f.elements.length;i++){ if(f.elements[i].className==cn){ f.elements[i].disabled=fl; f.elements[i].checked=false; } } } じゃだめなの？？？
お礼
丁寧に教えていただき有難うございました。 また、何かございましたら宜しくお願いいたします＞＜
お礼
丁寧に教えていただき有難うございました。 また、何かございましたら宜しくお願いいたします＞＜