1
我是网页设计的初学者，这是一个项目，我被授予但无论我做什么表单都不会提交。即使所有的输入都是正确的，但我点击提交后仍然无法执行任何操作。任何帮助表示赞赏。我搜索了一个小时，但没有任何工作。即使所有的字段被填充和检查，表格也不会提交
这只是一个简单的窗体结构。我的主要目标是验证代码并发送到PHP脚本。
<html>
<head>
<title>Form</title>
<style>
h1,h2 {
color:red;
text-align:center;
}
#form {
padding-left: 80px;
}
.fullname{
//border:1px solid;
padding:0 0 0 80px;
margin:0;
color:red;
font-style:italic;
font-size:13px;
white-space:nowrap;
//float:left;
//visibility:hidden;
}
.N {
//border-color:red;
border-radius:5px;
//text-shadow:0 0 2px #ddd;
}
</style>
</head>
<body>
<h1>Welcome</h1>
<!--onSubmit="return !!(validateFName() & validateLName() & validateGender() & validateMonth() & validateDay() & validateYear());" -->
<form id="form" name="myForm" action="new1.php" onSubmit="return validateName()" >
First Name:<input class="N" type="text" name="fname" value="enter name
here" /><br>
<div id="errorFName" class="fullname"></div>
Last Name:<input class="N" type="text" name="lname" value="enter name here"/><br>
<div id="errorLName" class="fullname"></div>
Gender:<br>
<input type="radio" name="sex" value="Male">Male
<input type="radio" name="sex" value="Female">Female<br>
<div id="gender" class="fullname" style="padding:0 0 0 15px;"></div>
Date Of Birth:<br>
Month:
<select name="month">
<option value="0">--Select Month--</option>
<option value="1">Janaury</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
 
Day:
<select name="day">
<option value='No'>--Select Day--</option>
<option value='Mo'>Monday</option>
<option value='tu'>Tuesday</option>
<option value='we'>Wednesday</option>
<option value='th'>Thursday</option>
<option value='fr'>Friday</option>
<option value='sa'>Saturday</option>
<option value='su'>Sunday</option>
</select>
 
Year:
<select name="year">
<script>
for(var i = 2017; i >= 1900; i--){
document.write('<option value="'+i+'">'+i+'</option>');
}
</script>
</select>
<br>
<span id="month_div" class="fullname" style="padding:0 0 0 60px;"></span>
<span id="day_div" class="fullname" style="padding:0 0 0 80px;"></span>
<span id="year_div" class="fullname" style="padding:0 0 0 65px;"></span><br>
<input type="submit" value="Submit">
</form>
<script>
var firstName = document.forms.myForm.fname;
var lastName = document.forms.myForm.lname;
var gender = document.forms.myForm.sex;
var months = document.forms.myForm.month;
var days = document.forms.myForm.day;
var years = document.forms.myForm.year;
var fname_error = document.getElementById("errorFName");
var lname_error = document.getElementById("errorLName");
var gender_error = document.getElementById("gender");
var month_error = document.getElementById("month_div");
var day_error = document.getElementById("day_div");
var year_error = document.getElementById("year_div");
function validateName() {
var validity = true;
validity &= validateFName();
validity &= validateLName();
validity &= validateGender();
validity &= validateMonth();
validity &= validateDay();
validity &= validateYear();
return validity;
}
function validateFName() {
if (firstName.value === "enter name here") {
firstName.value = "";
firstName.style.border = "1px solid red";
fname_error.textContent = "Fill User Name";
return false;
}
if (firstName.value !== "enter name here") {
// fname_error.innerHTML = "";
return true;
}
}
function validateLName() {
if (lastName.value === "enter name here") {
lastName.value = "";
lastName.style.border = "1px solid red";
lname_error.textContent = "Fill User Name";
return false;
}
}
function validateGender() {
if (gender[0].checked || gender[1].checked) {
gender_error.innerHTML = "";
return true;
} else {
gender_error.textContent = "select your sex";
return false;
}
}
function validateMonth() {
if (months.value !== "0") {
month_error.innerHTML = "";
day_error.style.padding = "0 0 0 175px";
return true;
} else {
month_error.textContent = "select the month";
return false;
}
}
function validateDay() {
if (days.value !== "No") {
day_error.innerHTML = "";
year_error.style.padding = "0 0 0 150px";
return true;
} else {
day_error.textContent = "select the day";
//day_error.style.padding = "0 0 0 80px";
return false;
}
}
function validateYear() {
if (years.value !== "2017") {
year_error.innerHTML = "";
return true;
} else {
year_error.textContent = "select the year";
return false;
}
}
</script>
</body>
</html>
编辑：只是试图用这种方式进行调试，而且即使返回值为true，它似乎也只是通过代码。
的放出来总是“它不工作”
function validateName() {
var validity = true;
validity &= validateFName();
if (validity === true)
alert("it works FName");
validity &= validateLName();
if (validity === true)
alert("it works LName");
validity &= validateGender();
if (validity === true)
alert("it works Gender");
validity &= validateMonth();
if (validity === true)
alert("it works Month");
validity &= validateDay();
if (validity === true)
alert("it works Day");
validity &= validateYear();
alert("it works Year");
if (validity === true)
return validity;
else
alert("it dosnt works");
}
编辑2.我现在的问题是提交。它会提交表单而不验证任何输入。它应该说“请填写字段”，但它只是去了PHP文件。
你的控制台给你任何错误？ – Luca
使用Chrome或FireFox在validateName函数中设置断点并验证该函数是否按预期返回。您可能只想添加简单的警报或控制台消息来验证函数正在被调用。 –
不，没有@LucaKiebel –