Question

我正在处理一份HTML文档，这是一份考试提交表单。我已经完成了几乎所有的设置任务，但是我在验证单选按钮时遇到了问题。我搜索了stackoverflow但是，答案不符合问题的标准。我完成的代码如下所示。

我在完成这项任务的大胆部分时遇到了麻烦：

向表单添加一组单选按钮以接受GCSE，AS或A2等条目。 编写一个功能，在警告框中显示用户的输入级别，以便确认或拒绝级别。

以下代码正常工作，不包括单选按钮的验证。 Seperatley，我的代码在函数validateForm（）中实现时不起作用。

<html>
<head>
<title>Exam entry</title>

<script language="javascript" type="text/javascript">

function validateForm() {

var result = true;
var msg = "";




if (document.ExamEntry.name.value == "") {
msg += "You must enter your name \n";
document.ExamEntry.name.focus();
document.getElementById('name').style.color = "red";
result = false;
}

if (document.ExamEntry.subject.value == "") {
msg += "You must enter the subject \n";
document.ExamEntry.subject.focus();
document.getElementById('subject').style.color = "red";
result = false;
}

if (document.ExamEntry.examno.value == "") {
msg += "You must enter your Examination Number \n";
document.ExamEntry.examno.focus();
document.getElementById('examinationno').style.color = "red";
result = false;
}
if (document.ExamEntry.examno.value.length!== 4) {
            msg+="Your Examination Number should be 4 digits.\n";
            document.ExamEntry.examno.focus();
            document.getElementById('examinationno').style.color="red";
            result = false;
        }


if(msg==""){
return result;
}
{
alert(msg)
return result;
}
}
</script>
    </head> 

    <body>
        <h1>Exam Entry Form</h1>

<form name="ExamEntry" method="post" action="success.html">
    <table width="50%" border="0">
        <tr></tr>
        <tr>
            <td id="name">Name</td>
            <td>
                <input type="text" name="name" />
            </td>
        </tr>
        <tr>
            <td id="subject">Subject</td>
            <td>
                <input type="text" name="subject" />
            </td>
        </tr>
        <tr>
            <td id="examinationno">Examination Number</td>
            <td>
                <input type="text" name="examno" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="radio" name="examtype" value="GCSE" />GCSE</td>
        </tr>
        <tr>
            <td>
                <input type="radio" name="examtype" value="AS" />AS</td>
        </tr>
        <tr>
            <td>
                <input type="radio" name="examtype" value="A2" />A2</td>
        </tr>
        <tr>
            <td>
                <input type="submit" name="Submit" value="Submit" onClick="return validateForm();" />
            </td>
            <td>
                <input type="reset" name="Reset" value="Reset" />
            </td>
        </tr>
    </table>
</form>

根据当前代码，为什么在添加到函数中时不会进行以下验证？：

if(document.getElementById('GCSE').checked)
{examtype = "GCSE";
}
if(document.getElementById('AS').checked)
{examtype = "AS";
}
if(document.getElementById('A2').checked)
{examtype = "A2";
}

if(confirm("You have selected"+examtype+.Continue?")){

if(msg==""){
return result;
}
{

alert(msg)
return result;
}
}

else{
alert("Action cancelled");
return false;
}

Answer 1

// Retrieving the checked radio button value
function getRadioValue (frmName, rbGroupName) 
{
    var radios = document[frmName].elements[rbGroupName];
    for (var i=0; i <radios.length; i++) 
    {
        if (radios[i].checked) 
        {
          return radios[i].value;       
        }
    }

    return false;
 }

在 validateForm（）

中调用 getRadioValue（）

 // examtype gets false or GCSE or AS or A2
 var examtype = getRadioValue ("ExamEntry", "examtype");

Answer 2

“继续”是一个关键字。所以你必须将它包装在撇号（“）中。我无法得到if语句的结构，我做了一些修改。我希望这就是你要找的......

   if(confirm("You have selected"+examtype+". Continue?")){

    if(msg==""){
    alert(msg);
    return result;
    }

    else{
    alert("Action cancelled");
    return false;
    }
}

单选按钮验证（警报框）确认和拒绝

2 个答案: