Question

我正在完成学校的家庭作业，但我仍然坚持第六个问题。

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

我的代码用于在启动另一个名为＆＃34; success＆＃34;的页面之前验证考试编号，姓名和主题。在这个问题中，我应该添加一条新规则，用户必须选择一个学习级别，例如＆＃34; GCSE＆＃34; ＆＃34; AS＆＃34;和＆＃34; A2＆＃34;。到目前为止，这是我的代码。

    <head>
<title>Exam entry</title>
<script language="javascript" type="text/javascript">
function validateForm()
{
 var result = true;
 var msg="";
 var n=(document.ExamEntry.exam.value.length);


 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.exam.value=="")
 {  
  msg+="You must enter the EN \n";
  document.ExamEntry.exam.focus();
  document.getElementById('exam').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(n!=4)  
 {
  msg+="You must enter a 4 digit number \n" ;
 document.ExamEntry.exam.focus();
 document.getElementById('exam').style.color="red";
  result=false;
 }


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

<body> 
<h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html">
<table width="50%" border="0">
 <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="exam">Examination Number</td>
  <td><input type="text" name="exam" /></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> 
</body>
<form>
  <input type="radio" name="educationlevel" value="GCSE"> GCSE<br>
  <input type="radio" name="educationlevel" value="AS"> AS<br>
  <input type="radio" name="educationlevel" value="A2"> A2<br>
</form>

我想创建另一个显示警告信息的功能，询问＆＃34;这是您选择的级别，请确认＆＃34;我尝试了不同的选项，例如

function confirm () {
     var alerttxt = "Are you sure you want to choose",
         value = document.ExamEntry.educationlevel.value;

     alerttxt += value;

     alert(alerttxt);
Elseif alert("Pick a level of study")
    }

但这似乎不起作用。它有效，但它继续成功＆＃34;成功＆＃34;页面，即使其他功能无效。我需要帮助，所以当只有两个功能都有效时，它会显示＆＃34;成功＆＃34;页。

Answer 1

您只想在某些字段正确归档时发送表单。为此，只需在包含sending option（提交按钮）的表单中添加：

onsubmit="return validateForm();"

如果一切都不正确，您的函数会返回 false 。通过发送 false ，表单不会被提交。如果一切正确，只需发送 true 即可。在你的例子中它应该是这样的：

<form name="ExamEntry" method="post" action="success.html" onsubmit="return validateForm();">

和您的提交按钮：

<input type="submit" name="Submit" value="Submit" />

对于您的确认提醒框，只需使用提示框，您可以在其中设置2个按钮，例如＆＃34; OK＆＃34;或＆＃34;返回＆＃34;。

要检查是否选中了其中一个radiobutton，请使用以下内容：

for(var i in document.forms[1]){
            if(document.forms[1].elements[i].checked);

或为您检查单选按钮的第二个表单命名

Answer 2

这里有一些问题。

您使用两个单独的表单作为输入字段和无线电字段，但是您使用第一个表单的名称调用无线电字段。
您正在覆盖默认设置＆＃34;确认＆＃34;功能。您需要在上一个函数中使用confirm而不是alert，因此您需要将confirm函数更改为其他名称
您还应该测试是否在提示之前选择了educationlevel而不是之后

在启动成功页面之前验证2个规则

2 个答案: