我目前正在使用html编写“表单条目”代码。我还使用JavaScript验证来验证表单中的输入。到目前为止,我有“姓名”,“主题”和“考试编号”。但是,我的验证不适用于我的考试编号。对于考试编号,我希望验证以确保输入仅4位,因此我添加了“ maxlength =“ 4””。如果有人可以帮助我进行验证,请首先验证考试编号并确保输入的数字为四位数,这将非常有帮助,谢谢
这是我的代码:
<head>
<title>Exam Entry</title>
<script language="javascript" type="text/javascript">
function validateForm(e) {
var result = true;
var msg="";
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.subject.value=="") {
msg+="You must enter the subject \n";
document.ExamEntry.subject.focus();
document.getElementById('subject').style.color="red";
result = false;
}
if (document.ExamEntry.Examination_number.value=="4") {
msg+="You must enter your Examination number \n";
document.ExamEntry.Examination_number.focus();
document.getElementById('Examination_number').style.color="red";
result = false;
}
if (msg != "") {
alert(msg);
}
return result;
}
</script>
</head>
<body>
<h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html" onsubmit="return validateForm();">
<table width="60%" 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>
<td id="Examination_number">Examination number</td>
<td><input type="text" maxlength="4" name="Examination_number" /></td>
</tr>
<tr>
<td><input type="submit" name="Submit" value="Submit" /></td>
<td><input type="reset" name="Reset" value="Reset" /></td>
</tr>
</table>
</form>
</body>
</html>
您实际上可以为此使用html5,不需要javascript!
与maxlength属性一起,包括以下属性:
pattern="\d{4}"
“ pattern”属性允许您指定用于验证输入的正则表达式模式。
\d
正则表达式是“数字”的意思。{4}
是正则表达式,表示精确重复4次。
现在,maxlength属性实际上是多余的,可以删除,因为正则表达式将自行限制输入的长度。
因此,总的来说,您的元素可能看起来像:
<input type="text" pattern="\d{4}" name="Examination_number" />
还请注意:记住客户端验证不等同于服务器端验证,这一点也很重要。任何具有基本Webdev知识的人仍然可以将无效Examination_Number
值发布到您的服务器。您的服务器还必须能够验证这些值。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句