※ ChatGPTを利用し、要約された質問です(原文:正解の答えを表示したいのですが・・・)
このQ&Aのポイント
ラジオボタンで解答を選択し、採点ボタンを押すと正答が表示される方法について教えてください。
「○×」表示の横に、×の場合に正しい答えを(A)と表示するようにしたいです。
どのように実装すればよいか、詳細な手順を教えてください。
先日、ラジオボタンで解答を選択し、採点ボタンを押すと「○×」が出るように教えていただきました。
さらに、「○×」表示の横に、「×」の場合に正しい答えを(「A」)と表示するようにしたいと思っています。
ぜひ教えてください。よろしくお願いいたします。
<html>
<head>
<style type="text/css">
<!--
.maru{
display:inline;
width:20px;
border:0px solid ;
color:red;
font-weight:600;
}
-->
</style>
<script language=javascript>
function displayScore(f){
var score = 0;
var radios=new Object();
for(i =0 ; i<f.length;i++){
if(f[i].type=="radio"){
if(!radios[f[i].name]){
radios[f[i].name]=new Object()
radios[f[i].name].flg=false;
radios[f[i].name].name=f[i].name;
}
if(f[i].checked == true){
radios[f[i].name].flg=true;
radios[f[i].name].score=parseInt(f[i].value);
}
}
}
for(var i in radios){
if(radios[i].flg==false){
alert(radios[i].name+"のチェックが抜けてます");
return false;
}
score+=radios[i].score;
f["maru_"+i].value=radios[i].score==0?"×":"○";
}
alert(" あなたの点数は " + score + " 点 です");
document.form1.score.value=score
}
</script>
<META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 11.0.0.0 for Windows">
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<TITLE></TITLE>
</head>
<body>
<FORM name="form1">
<TABLE bgcolor="#999999" cellpadding="0" cellspacing="1" height="10">
<TBODY>
<TR>
<TD width="193" valign="middle" bgcolor="#ffffff" align="left" height="25"><FONT color="#000000" size="2"> Q1:あいうえお</FONT></TD>
<TD valign="middle" width="151" bgcolor="#ffffff" align="left" height="25"><FONT color="#000000" size="2"><input type="radio" name="q1" value="10" id="q1_1"><label for="q1_1">A</label> <input type="radio" name="q1" value="0" id="q1_2"><label for="q1_2">B</label> <input type="radio" name="q1" value="0" id="q1_3"><label for="q1_3">C</label></FONT></TD>
<TD valign="middle" bgcolor="#ffffff" align="center" height="25" width="44"><FONT color="#000000" size="2"><input type="text" name="maru_q1" class="maru"><BR>
</FONT></TD>
<TD valign="middle" bgcolor="#ffffff" width="38"></TD>
</TR>
<TR>
<TD valign="middle" bgcolor="#ffffff" align="left" height="25"><FONT color="#000000" size="2"> Q2:かきくけこ</FONT></TD>
<TD valign="middle" bgcolor="#ffffff" align="left" height="25"><FONT color="#000000" size="2"><INPUT type="radio" name="q2" value="10" id="q2_1"><LABEL for="q2_1">A</LABEL> <INPUT type="radio" name="q2" value="0" id="q2_2"><LABEL for="q2_2">B</LABEL> <INPUT type="radio" name="q2" value="0" id="q2_3"><LABEL for="q2_3">C</LABEL></FONT></TD>
<TD valign="middle" bgcolor="#ffffff" align="center" height="25" width="44"><FONT color="#000000" size="2"><INPUT type="text" name="maru_q2" class="maru"><BR>
</FONT></TD>
<TD valign="middle" bgcolor="#ffffff" width="38"></TD>
</TR>
</TBODY>
</TABLE>
<DIV align="left"><INPUT type="button" value=" 採 点 " onclick="displayScore(this.form)"><BR>
<BR>
<TABLE border="0" bgcolor="#ffff66">
<TBODY>
<TR>
<TD width="213" valign="middle"><FONT color="#000000" size="2"><B> あなたの点数</B> <INPUT type="text" style="ime-mode:active;text-align : center;" size="10" name="score" readonly> <B>点</B></FONT>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
</FORM>
<DIV align="left"></DIV>
</body>
</html>
お礼
どうもありがとうございます。まだまだ初心者で高度なワザで私には難しいですが、頑張って勉強していきたいと思います!