ラジオボタンで解答・点数表示
- 10問のテストを作成しています。選択肢はラジオボタンで3択であり、正解は10点、その他は0点となります。
- 採点をクリックすると、テキストボックスに○×の結果を表示し、もう一つのテキストボックスには不正解の場合は正しい解答を表示します。
- 最終的にアラートで「あなたの点数は〇〇点」と表示し、テキストボックスに得点を表示します。また、FORM1.2のSCOREにも点数を表示します。
- ベストアンサー
ラジオボタンの選択で解答・点数を表示する
10問のテストを作成しています。 (1)選択肢はラジオボタンで3択（正解は10点、その他0点） (2)採点をクリックすると、テキストボックスに○×の結果を出し、もう一つ別のテキストボックスに×の場合は正しし解答を表示 (3)アラートで「あなたの点数は～～点」と出す (4)FORM1.2のSCOREに点数を表示 以上のようにしたいと思い、下記のように作りました。 まだ初心者のため、長々と同じことを書くことしか分からないので、もっと簡単にまとめられる方法がありましたら、教えてください。 よろしくお願いいたします。 function dispscore() { var score=0; if (document.form1.q0[0].checked) { score += 10; document.form1.r0.value = "○"; } else{ document.form1.r0.value = "×"; document.form1.a0.value = "ナイル川"; } if (document.form1.q1[2].checked) { score += 10; document.form1.r1.value = "○"; } else{ document.form1.r1.value = "×"; document.form1.a1.value = "バチカン市国"; } alert("点数は " + score + " 点 です "); document.form1.score.value=score document.form2.score.value=score } ------------------------------------------------------------ <INPUT type=radio name="q1" value="10">ナイル川 <INPUT type=radio name="q1" value="0">ミシシッピー川 <INPUT type=radio name="q1 value="0">アマゾン川> <INPUT size="3" name="r1" type="text"> <INPUT size="25" name="a1" type="text"> <INPUT type=radio name="q2" value="0">バルカン市国 <INPUT type=radio name="q2" value="0">バルタン市国 <INPUT type=radio name="q2" value="10">バチカン市国 <INPUT size="3" name="r2" type="text"> <INPUT size="25" name="a2" type="text">
- machaleo
- お礼率41% (10/24)
- JavaScript
- 回答数1
- ありがとう数6
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
http://oshiete1.goo.ne.jp/qa3558102.html ちょっと前に書いたのを改良してこんな感じでどうでしょう？ <html> <head> <script language=javascript> var obj=new Array(10); for(var i=0;i<obj.length;i++){ obj[i]=new Object; obj[i].setObj=setObj; } //setObj(問題文,回答の選択肢をArrayでかく,正解番号、1項目目=0,配点); obj[0].setObj("世界一長い川は？",Array("ナイル川","ミシシッピー川","アマゾン川"),0,10); obj[1].setObj("実在するのは？",Array("バルカン市国","バルタン市国","バチカン市国"),2,10); obj[2].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[3].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[4].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[5].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[6].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[7].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[8].setObj("省略:答えは0",Array("0","1","2"),0,10); obj[9].setObj("省略:答えは0",Array("0","1","2"),0,10); function setObj(question,answers,correct,point){ this.question=question; this.answers=answers; this.correct=correct; this.point=point; } function check(f){ var point=0; for(var i=0;i<obj.length;i++){ var num=getNumber(f["q-"+i]); if(num >=0) point +=parseInt(f["q-"+i][num].value); f["r-"+i].value =((obj[i].correct==num)?"○":"×"); f["a-"+i].value =obj[i].answers[obj[i].correct]; } alert("あなたの点数は"+point+"点") f.score.value=point; } function getNumber(radio){ for(var i=0;i<radio.length;i++){ if(radio[i].checked) return i; } return -1; } </script> </head> <body> <form> <script> for(var i=0;i<obj.length;i++){ document.write("質問"+(i+1)+":"+obj[i].question+"("+obj[i].point+"点)"+"<br>") for(var j in obj[i].answers){ document.write("<input type='radio' name='q-"+i+"' id='q-"+i+"-"+j+"' value='"+(j==obj[i].correct?obj[i].point:0)+"'><label for='q-"+i+"-"+j+"'>"+obj[i].answers[j]+"</label>") } document.write("<br><input size='3' type='text' name='r-"+i+"'><input type='text' name='a-"+i+"'>"); document.write("<br>") } </script> <hr> <input type="button" value="採点" onClick="check(this.form)"><br> SCORE:<input type="text" name="score"><br> </form> </body> </html>
関連するQ&A
- ラジオボタンの選択項目によってコメントを表示する方法
ラジオボタンの「Yes・No」にチェックすると、チェックした項目別に欄外にコメントを表示するページを作成しました。 初心者のため、Q1～Q15までcheckの方法を延々と書いたのですが、もっと簡単に書く方法はありますでしょうか？ 参考にQ1・Q2の分を掲載させていただきます。 ぜひ、教えてください。よろしくお願いいたします。 <SCRIPT language="JavaScript"> <!-- function check(){ if (document.form1.q1[0].checked){ document.form1.q1com.value="減量しましょう"; } if (document.form1.q1[1].checked){ document.form1.q1com.value="引き続き注意を"; } if (document.form1.q2[0].checked){ document.form1.q2com.value="再検査を受けましょう！"; } if (document.form1.q2[1].checked){ document.form1.q2com.value="チェックしましょう"; } // --> </SCRIPT> <INPUT type="radio" name="q1"> Yes <INPUT type="radio" name="q1"> No <INPUT size="41" type="text" name="q1com"> <INPUT type="radio" name="q2"> Yes <INPUT type="radio" name="q2"> No <INPUT size="44" type="text" name="q2com"> <INPUT type="button" value=" 診断ボタン " onclick="check();>
- ベストアンサー
- JavaScript
- ラジオボタンを選択したらテキストに数字入力
ラジオボタンを選択してvalueが1だったら、テキスト欄（Q1_TEXT）に0を入力し、それ以外だったら何もしない、というJavascriptを書きたいです。ラジオボタンによって、テキスト欄の有効化、無効化に関する書き方は見つけられたのですが、このような挙動について見つけることができませんでした。 ご存じの方がおられましたらご教示いただけますと助かります。 よろしくお願いいたします。 <body> <form> <INPUT type="radio" name="Q1" value="1"> <INPUT type="radio" name="Q1" value="2"> <INPUT type="radio" name="Q1" value="3"> <INPUT type="text" name="Q1_TEXT" value="_Q1_TEXT_CHK_" SIZE="7"> </form> </body>
- ベストアンサー
- JavaScript
- ラジオボタンについて
つまらない質問ですがどうか教えてください。 <form name="myform"> ・ ・ ・ <INPUT TYPE="RADIO" NAME="R1" VALUE="1">関連あり</INPUT> <INPUT TYPE="RADIO" NAME="R1" VALUE="2">関連なし</INPUT> <INPUT TYPE="RADIO" NAME="R1" VALUE="3">不明</INPUT> </form> 上記のようなラジオボタンを作ったのですが、 このラジオボタンのチェックされた値を取得するには document.myForm.cGyoumu.value ではできないのでしょうか？ LOOPさせながらdocument.myForm.elements(i).checked で探さないと取得できないのでしょうか？ 同じフォーム内にラジオボタンが複数あるため、 この方法はあまりやりたくありません。 ほかに方法がありましたら、どうか教えてください。
- ベストアンサー
- JavaScript
- ラジオボタンの値を・・・・・
<html> <head> <script language="javascript"> function osu(){ document.form1.text1.value=document.form1.radio1.value; } </script> </head> <body> <form name="form1"> <input type="radio" name="radio1" value="男" checked>男 <input type="radio" name="radio1" value="女">女 <input type="button" value="押す" onClick="osu()"> <input type="text" name="text1"> </form> </body> </html> ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 上記のプログラムは、選択されたラジオボタンの値をテキストボックスに表示させるプログラムなんですが、何故かラジオボタンの値が表示されず、「undefined」というのが表示されます。 どうすれば、「男」または「女」という値を表示させることができますか？ ちなみにこれは、「○○○．ｈｔｍｌ」で保存します
- 締切済み
- JavaScript
- ラジオボタンでの表示の切替方法
2つのラジオボタンの切替によって、表示の切替を行いたいです。 例えば、Aを選択すると(1)の入力フォームが表示され、Bを選択すると(2)が表示したいです。初期表示はAが選択された時と同じ内容となります。 <table align="center" border="0" cellpadding="0" cellspacing="0"> <tr><td><form name="Quick1"> <tr><td>選択</td> <td> <input type="radio" name="A" value="1" checked>A <input type="radio" name="B" value="2">B </td></tr> <tr> <td>(1)</td> <td> <input type="text" size="6" maxlength="5" name="text1" value="">－ <input type="text" size="6" maxlength="5" name="text2" value="">－ <input type="text" size="6" maxlength="5" name="text3" value=""> </td></tr> <tr> <td>(2)</td> <td> <input type="text" name="text7" size="43" value=""> </td></tr> </table></form></td></tr></table> すみませんが、よろしくお願い致します。
- ベストアンサー
- JavaScript
- ラジオボタン選択でtextfieldをアクティブにするには？
■下記サンプルソースのラジオボタン「はい」を選択するとtextfieldがアクティブになるJavaScriptがわからず困っております。教えて頂けないでしょうか。 （ページ開いた際は「いいえ checked」でtextfieldはグレーで入力無効） 可能であればシンプルなソースで「最新のWinIE、MacSafari」に対応していると非常に助かります。先輩方よろしくお願いします。 <form name="form1" method="post" action=""> <table> <tr> <td>■「はい」を選択すると、textfield（カテゴリー1～4）がアクティブになる</td> </tr> <tr> <td> <input name="radiobutton" type="radio" value="radiobutton">はい <input name="radiobutton" type="radio" value="radiobutton" checked>いいえ </td> </tr> <tr> <td> カテゴリー1<input name="textfield" type="text" size="30" maxlength="30"> <br> カテゴリー2 <input name="textfield22" type="text" size="30" maxlength="30"> <br> カテゴリー3 <input name="textfield32" type="text" size="30" maxlength="30"> <br> カテゴリー4 <input name="textfield42" type="text" size="30" maxlength="30"> </td> </tr> </table> </form>
- ベストアンサー
- JavaScript
- ラジオボタンとonchange
質問が２つあります。 １、下記が正常に動きません。どこがおかしいのでしょう・・ (^^; ２、下記のような内容で、選択肢が増えた時に、もっと簡単に書く方法が知りたい。 <script Language="JavaScript"><!-- function set() { uriage = document.main.売上.value; omake = document.main.クーポン使用.value; if(document.main.クーポン.value = 1) {document.main.料金.value = uriage ;} else if(document.main.クーポン.value = 2) {document.main.料金.value = uriage-omake ;} } // --> </script> <FORM name="main" ACTION="★" METHOD="POST"> <INPUT TYPE="HIDDEN" NAME="売上" SIZE="-1" VALUE="1500"> <INPUT TYPE="HIDDEN" NAME="クーポン使用" SIZE="-1" VALUE="750"> <INPUT TYPE="RADIO" NAME="クーポン" VALUE="1" onChange="set(this)">クーポン使用しない<BR> <INPUT TYPE="RADIO" NAME="クーポン" VALUE="2" onChange="set(this)">使用する<BR> <P> <INPUT TYPE="TEXT" NAME="料金" SIZE="12"> <INPUT TYPE="SUBMIT" NAME="SUBMIT_BUTTON" VALUE="送信"></TD> </form>
- ベストアンサー
- JavaScript
- ラジオボタン
<html> <head> <title></title> <script type="text/javascript"> function check() { var s=0; if(document.forms["f2"].elements["stay"].checked) { var radios = document.forms["f2"].elements["aa"]; if(document.forms["f2"].elements["aa"].checked) s += 1800; if(document.forms["f2"].elements["aa"].checked) s += 2800; if(document.forms["f2"].elements["aa"].checked) s += 3800; if(document.forms["f2"].elements["aa"].checked) s += 2000; document.forms["f2"].elements["total"].value = s ; } } </script> </head> <body> <form name="f2" action="#"> <h4>Q1.テーマパークに入りますか？</h4> <p> <input type="checkbox" name="stay" value="">入場する </p> <h4>Q2.年齢は？</h4> <p> <input type="radio" name="aa" value="" checked>6歳未満 <input type="radio" name="aa">6歳以上18歳未満 <input type="radio" name="aa">18歳以上60歳未満 <input type="radio" name="aa">60歳以上 </p> <h4>入場料金は次の通りです。</h4> <p> <input type="button" value="計算" onclick="check();"> <input type="text" name="total" value="" size="18">円です。 </p> </form> </body> </html> これでやると何を選択しても0円になるんですけど、 どうすればいいですか？
- ベストアンサー
- JavaScript
- JavaScriptのラジオボタン選択で値取得
JavaScriptでフォームのラジオボタン選択で選択した項目に応じて、複数の変数に特定の数値を入れたいのですが、どうしたらいいでしょうか? ラジオボタンで仮に、 ・東京 ・大阪 ・名古屋 という選択があったとして、 (そのボタンの下部に<input type="button" value="Go!" onclick="hogehoge();">というような実行ボタンがあったとします) 東京を選んだ場合は、 a = 4; b = 3; 大阪を選んだ場合は、 a = 3; b = 2; 名古屋を選んだ場合は、 a = 5; b = 4; と、a/bに数値を入れたいです。 今現在下記のように書いたのですが、動作しません。 <script type="text/javascript"> function hogehoge() { no = document.hoge.a.value - 0; if(no == 1) { n1 = 4; n2 = 3; }else if(no == 2) { n1 = 3; n2 = 2; }else if(no == 3) { n1 = 5; n2 = 4; } document.hoge.no1.value = n1; document.hoge.no2.value = n2; } </script> <form name="hoge"> <input type="radio" name="a" value="1" checked>東京 <input type="radio" name="a" value="2">大阪 <input type="radio" name="a" value="3">名古屋 <br> <input type="button" value="Go!" onclick="hogehoge();"><br> <input type="text" size="5" name="no1"><br> <input type="text" size="5" name="no2"> </form> よろしくお願いいたします。
- ベストアンサー
- JavaScript
- ボタンを押したらラジオボタンを選択したい(サンプルソース付)
ボタンを押したら、ラジオボタンを選択するようにしたいと思っています。 なんとかチェックボックス、セレクトボックス(?)はうまくいったのですが、どうしてもラジオボタンだけがうまくいきません。どうすればよいでしょうか？ ※document.forms[0].R1[0].checked = true; のようにすると意図した通りに動作することはわかったのですが、項目が増えた時にミスの原因になりますので、できるだけ"a"や"b"とvalueを使いたいと思っています。 すみませんが、よろしくお願いします。 -- <html> <head> <SCRIPT language="JavaScript"><!-- function check() { document.forms[0].C1.checked = true; document.forms[0].S1.value = "3"; document.forms[0].R1.value = "a"; } //--></SCRIPT> <title></title> </head> <body> <form> <input type="checkbox" value="yes" name="C1"><br> <select name="S1"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select><br> <input type="radio" name="R1" value="a"><input type="radio" name="R1" value="b"><br> <input type="button" onclick="javascript:check()"> </form> <br> </body> </html>
- ベストアンサー
- JavaScript
