- ベストアンサー
ラジオボタンが未選択時の制御方法について
- Webフォームのラジオボタンが未選択の場合に、ハヌけした書式で出力させない方法について教えてください。
- Webフォームのラジオボタン1とラジオボタン3を選択し、ラジオボタン2を選択せずに出力すると、ハヌけした書式で出力されます。ハヌけしないように出力させる方法はありますか？
- Webフォームのラジオボタンが未選択の場合、出力結果にハヌけした書式で表示されてしまいます。ハヌけしないように出力させる方法を教えてください。
- yumi007
- お礼率70% (12/17)
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
なぜifの処理から text += '\n'; を外しているのでしょうか？ >text += '【ラジオボタン2】：' + '\n' + radio02[i].value;}} >text += '\n'; が text += '【ラジオボタン2】：' + '\n' + radio02[i].value; text += '\n';}} でよいのでは？ ただ結構HTMLの処理がずさんです、idの振り方とかクォーテーションの 入れ方のミスとか・・・ 全体の流れ的にはフォームのエレメンツを押し並べてチェックする手もありますね <script> function textoutput(f) { var text = '下記リカバリシートを案内' + '\n'; for(var i=0;i<f.length;i++){ if(f[i].type=="radio" && f[i].name=="A01" && f[i].checked==true){ text += '【ラジオボタン1】：' + '\n' + f[i].value+ '\n'; } if(f[i].type=="radio" && f[i].name=="A02" && f[i].checked==true){ text += '【ラジオボタン2】：' + '\n' + f[i].value+ '\n'; } if(f[i].type=="radio" && f[i].name=="A03" && f[i].checked==true){ text += '【ラジオボタン3】：' + '\n' + f[i].value+ '\n'; } } f.elements["output"].value = text; } </script> <strong>リカバリシート案内フォーム</strong><br /><br /> <form> <strong>・ラジオボタン1</strong><br /> <input type="radio" name="A01" value="回答1" id="radio1-1"> <label for="radio1-1">回答1</label> <input type="radio" name="A01" value="回答2" id="radio1-2"> <label for="radio1-2">回答2</label> <input type="radio" name="A01" value="回答3" id="radio1-3"> <label for="radio1-3">回答3</label> <br> <strong>・ラジオボタン2</strong><br> <input type="radio" name="A02" value="回答1" id="radio2-1"> <label for="radio2-1">回答1</label> <input type="radio" name="A02" value="回答2" id="radio2-2"> <label for="radio2-2">回答2</label> <input type="radio" name="A02" value="回答3" id="radio2-3"> <label for="radio2-3">回答3</label> <br> <strong>・ラジオボタン3</strong><br> <input type="radio" name="A03" value="回答1" id="radio3-1"> <label for="radio3-1">回答1</label> <input type="radio" name="A03" value="回答2" id="radio3-2"> <label for="radio3-2">回答2</label> <input type="radio" name="A03" value="回答3" id="radio3-3"> <label for="radio3-3">回答3 </label> <br> ログ出力<br> <input type="button" value="ログ出力" onClick="textoutput(this.form);"> <input type="reset" value="リセット"><br> <textarea name="output" cols="60" rows="10"></textarea><br> </form>
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
>もう少し噛み砕いて まず <input type="button" value="ログ出力" onClick="textoutput(this.form);"> とすることでinputの親要素であるフォームをtextoutputの引数として わたすことができます。 formは0から始まる子エレメンツをもっておりエレメンツの総数はform.length と同値です。したがって for(var i=0;i<f.length;i++){ } とするとfのすべての要素を走査することができ、各要素へは f[i]でアクセスできます。 またifでチェックしているのは３項目、すなわち f[i].type=="radio"・・・要素のタイプがradioである f[i].name=="～" ・・・要素の名前が～である f[i].checked==true ・・・要素にチェックがついている これを&&でつなぐと全ての条件に合致する必要があります ifの条件で合致する場合textに値を書き込むのが text += '【ラジオボタン～】：' + '\n' + f[i].value+ '\n'; です。 構造を把握できればさほど難しいことはないと思います
お礼
分かりやすい説明をありがとうございました。 仕組みを理解して少しずつですが、 JavaScriptが使えるよう勉強したいと思います。 ご教授頂きありがとうございました。
お礼
まだまだHTMLもJavaScriptも勉強を始めてから2日ですが、 右も左も分からぬまま、なんとか構文等が理解出来るように頑張ってます！ <script>と</script>の間の部分をもう少し噛み砕いてご教授頂けますでしょか？ 変数とかがやっとボンやりと理解をし始めてるところです。 どうぞ何卒よろしくお願い致します。