我有一个 HTML 文件、JavaScript 文件和一个 PHP 文件。JavaScript 用于验证用户输入，然后将表单传递到 PHP 页面。
验证功能运行良好，但表单不会从 JavaScript 提交到 PHP 文件。
在花了两天时间之后，我仍然无法弄清楚我有什么问题以及为什么 JavaScript 不会将表单数据提交到 PHP 文件中以及如何在提交后出现 PHP 页面
HTML：
<div class = "formtext">
<p>
<form id = "formtext" name="survey" method="post" action="formtext.php">
<table id="surveytable" width="300" border="1">
<tr>
<td>
Name:
<input type = "text" id="userName"
name="name" onkeyup="document.getElementById('mirror').innerHTML=this.value" />
<br/ >
Your name: <span id="mirror"></span>
</td>
</tr>
<tr>
<td>
Number:
<input type = "text" id="userNumber"
name="number" onkeyup="document.getElementById('mirror1').innerHTML=this.value" />
<br />
Your number: <span id="mirror1"></span>
</td>
</tr>
<tr>
<td>
Email:
<input type = "text" id="userEmail"
name="email" onkeyup="document.getElementById('mirror2').innerHTML=this.value" />
<br />
Your email: <span id="mirror2"></span>
</td>
</tr>
<tr>
<td>
Gender:<br />
<input type="radio" name="gen" id="userGender" value="Decline"
checked/> Decline<br />
<input type="radio" name="gen" id="userGender" value="Male" />Male<br />
<input type="radio" name="gen" id="userGender" value="Female" /> Female
<tr>
<td>
Major:
<select name="major" id="userMajor">
<option value="" selected="selected">Select Major</option>
<option value="Computer Science">Computer Science</option>
<option value="Information Technology">Information Technology</option>
<option value="Engineering">Engineering</option>
<option value="Biology">Biology</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td>
Hobbies:<br />
<input name="hob" id="userHobby" type="checkbox" value="Running,
" + " " />Running<br />
<input name="hob" id="userHobby" type="checkbox" value="Sleeping,
" + " "/>Sleeping<br />
<input name="hob" id="userHobby" type="checkbox" value="Fishing,
" + " "/>Fishing<br />
<input name="hob" id="userHobby" type="checkbox" value="Other" />Other
</td>
</tr>
</table>
<p>
<input type="button" value="Enter" onclick="Survey()"/>
</p>
</form>
</div>
</form>
JavaScript：
function Survey()
{
if (!ValidateForm())
{
return false;
}
else {
var userName = document.forms[0].name.value+"<br />";
var userNumber = document.forms[0].number.value+"<br />";
var userEmail= document.forms[0].email.value+"<br />";
var sex;
if (document.forms[0].gen[0].checked)
sex=document.forms[0].gen[0].value;
else if (document.forms[0].gen[1].checked)
sex=document.forms[0].gen[1].value;
else if (document.forms[0].gen[2].checked)
sex=document.forms[0].gen[2].value;
var userGender = sex+"<br />";
var userMajor = document.forms[0].major.value+"<br />";
var hobby=new Array()
var counter=0;
for (i=0;i<document.forms[0].hob.length;i++)
{
if (document.forms[0].hob[i].checked)
{
hobby[counter]=document.forms[0].hob[i].value;
counter++;
}
}
var hobPick="";
for (n=0;n<hobby.length;n++)
hobPick+=hobby[n];
var userHobby = hobPick;
document.getElementById("printName").innerHTML = userName
document.getElementById("printNumber").innerHTML = userNumber
document.getElementById("printEmail").innerHTML = userEmail
document.getElementById("printGender").innerHTML = userGender
document.getElementById("printMajor").innerHTML = userMajor
document.getElementById("printHobby").innerHTML = userHobby
document.getElementById('formtext').submit();
}
}
function ValidateForm()
{
if (document.forms[0].name.value.length === 0)
{
alert("Name is Required");
return false;
}
else if
(document.forms[0].number.value.length === 0)
{
alert("Number is Required");
return false;
}
else if
(document.forms[0].email.value.length === 0)
{
alert("Email is Required");
return false;
}
else if
(document.forms[0].userMajor.value === "")
{
alert("Major is Required");
return false;
}
else if
(document.forms[0].userHobby[0].checked === false &&
document.forms[0].userHobby[1].checked=== false &&
document.forms[0].userHobby[2].checked === false &&
document.forms[0].userHobby[3].checked === false)
{
alert("hobby is Required");
return false;
}
else
{
return true;
}
}
PHP：
<table id='userInputTbl' width='600' border='1'>
<tr>
<td id='tblName' colspan='6'>
<strong>You Submitted: </strong><br />
</td>
</tr>
<tr>
<td><strong>Name:</strong><br />
</td>
<td> <?echo $_POST["printName"]?></td>
</tr>
<tr>
<td><strong>Number:</strong><br /></td>
<td> <?echo $_POST['printNumber']?></td>
</tr>
<tr>
<td><strong>Email:</strong><br /></td>
<td> <?echo $_POST['printEmail']?></td>
</tr>
<tr>
<td><strong>Gender:</strong><br /></td>
<td> <? echo $_POST['printGender']?></td>
</tr>
<tr>
<td><strong>Major:</strong><br /></td>
<td> <? echo $_POST['printMajor']?></td>
</tr>
<tr>
<td><strong>Hobbies:</strong><br /></td>
<td> <? echo $_POST['printHobby']?></td>
</tr>
</table>