1
Надеюсь, вы можете помочь, я делаю HTML-форму, которая использует проверку JavaScript. Валидация формы работает на имя, фамилию и город. Однако по какой-то причине он не работает на линии Frist или второй строке адреса, а также в почтовом индексе, и я не могу сказать, почему. Любая помощь будет оценена по достоинству. Ниже приведены HTML и JavaScript.Проверка формы JavaScript, не работающая со всеми полями HTML
HTML:
<!DOCTYPE html>
<html>
<head>
<Title> In Class Test 5 </title>
<script src="RegisterCustomerValidation.js"></script>
<body>
<h1> Working out the difference between today and your selected date </h1>
<Form name="MyForm" >
<br> Please enter your first name:
<input type="text" id="Fname"> <br>
Please enter your surname:
<input type="text" id="Sname"> <br>
Please enter your first line of address
<input type="text" id="FLINE"> <br>
Please enter your Second line of address
<input type="text" id="SLINE"> <br>
Please enter your City or Town
<input type="text" id="Town"> <br>
Please enter your postcode
<input type="text" id="Pcode"> <br>
Please enter a email:
<input type="text" id="Email" size=15><br>
Please enter your home number:
<input type="text" id="Hnumber" size=15><br>
Please enter your mobile number
<input type="text" id="Mnumber" size=15><br>
<button type="button" onclick="return f1()">Submit</button>
</Form>
</body>
</html>
Мои JavaScript:
function checkFName() {
var Fname = document.forms["MyForm"]["Fname"].value;
if (Fname == null || Fname == "") {
alert("Name must be filled out");
document.MyForm.Fname.focus();
document.getElementById("Fname").style.border = '2px solid red';
return true;
}
}
function checkSName() {
var Sname = document.forms["MyForm"]["Sname"].value;
if (Sname == null || Sname == "") {
alert("Surname must be filled out");
document.MyForm.Sname.focus();
document.getElementById("Sname").style.border = '2px solid red';
return true;
}
}
function checkTown() {
var Town = document.forms["MyForm"]["Town"].value;
if (Town == null || Town == "") {
alert("Town must be filled out");
document.MyForm.Town.focus();
document.getElementById("Town").style.border = '2px solid red';
return true;
}
}
function Pcode() {
var Pcode = document.forms["MyForm"]["Pcode"].value;
if (Pcode == null || Pcode == "") {
alert("Town must be filled out");
document.MyForm.Pcode.focus();
document.getElementById("Pcode").style.border = '2px solid red';
return true;
}
}
function checkFLA() {
var FLA = document.forms["MyForm"]["FLINE"].value;
if (FLA == null || FLA == "") {
alert("First line of address must be filled out");
document.MyForm.FLINE.focus();
document.getElementById("FLINE").style.border = '2px solid red';
return true;
}
}
function checkSLA() {
var SLA = document.forms["MyForm"]["SLINE"].value;
if (SLA == null || SLA == "") {
alert("Second line of address must be filled out");
document.MyForm.SLINE.focus();
document.getElementById("SLINE").style.border = '2px solid red';
return true;
}
}
function f1() {
alert("hello world");
if (checkFName(Fname)) {
alert("First name must be filled out");
document.MyForm.Fname.focus();
document.getElementById("Fname").style.border = '2px solid red';
}
if (checkSName(Sname)) {
alert("Surname must be filled out");
document.MyForm.Sname.focus();
document.getElementById("Sname").style.border = '2px solid red';
}
if (checkTown(Town)) {
alert("Town must be filled out");
document.MyForm.Town.focus();
document.getElementById("Town").style.border = '2px solid red';
}
if (checkPcode(Pcode)) {
alert("Surname must be filled out");
document.MyForm.Pcode.focus();
document.getElementById("Pcode").style.border = '2px solid red';
}
if (checkFLA(FLA)) {
alert("First line of address must be filled out");
document.MyForm.FLINE.focus();
document.getElementById("FLINE").style.border = '2px solid red';
}
if (checkSLA(SLA)) {
alert("Second line of address must be filled out");
document.MyForm.SLINE.focus();
document.getElementById("SLINE").style.border = '2px solid red';
}
}
Возможно, вам стоит взглянуть на руководство по стилю JavaScript в AirBnB. https://github.com/airbnb/javascript – whoacowboy
@whoacowboy, как это помогает OP? –
@ Джорди см. Мой ответ ниже. – whoacowboy