gpt4 book ai didi

JavaScript 表单验证不适用于所有 HTML 字段

转载 作者:行者123 更新时间:2023-11-30 12:27:08 24 4
gpt4 key购买 nike

希望您能提供帮助,我正在制作一个使用 JavaScript 验证的 HTML 表单。表单验证适用于名字、姓氏和城镇。但是,出于某种原因,它不适用于地址的第一行或第二行以及邮政编码,我无法说出原因。任何帮助,将不胜感激。下面是 HTML 和 JavaScript。

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';

}


}

最佳答案

我找到了。您的程序因邮政编码而窒息。

你正在检查 -> if (checkPcode(Pcode))

但是函数的正确名称是 Pcode 而不是 checkPcode -> function Pcode() {

编辑。是的,我刚刚修复了 FLA。不要传递任何参数,即没有 FLA 只是 if(checkFLA()) - 我认为它应该有效。

关于JavaScript 表单验证不适用于所有 HTML 字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28992764/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com