[英]javascript validation rules not working
我有以下代码,验证规则无效,请提供任何帮助! 网络浏览器无法识别javascript代码,因为似乎未显示活动的x控件。
<HTML>
<head>
<title>Exam entry</title>
<script lanuage="javascript" type="text/javascript">
var result = true;
function validateForm() {
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.ExaminationNumber.value=="") {
msg+("You must enter the Examination Number \n");
document.ExamEntry.ExaminationNumber.focus();
document.getElementById('ExaminationNumber').style.color="red";
result false;
}
if(msg==""){
return result;
}
{
alert(msg)
return result;
}
}
</script>
<form>
<input type="radio" name="qualification" value="GCSE">GCSE<br>
<input type="radio" name="qualification" value="AS">AS<br>
<input type="radio" name="qualification" value="A2">A2<br>
</form>
</head>
<body>
<h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html">
<table width="50%" 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>
<tr>
<td id="ExaminationNumber">ExaminationNumber</td>
<td><input type="text" name="ExaminationNumber" /></td>
</tr>
<tr>
<td><input type="submit" name="Submit" value="Submit" onclick="return validateForm();" /></td>
<td><input type="reset" name="Reset" value="Reset" /></td>
</tr>
</table>
</form>
</body>
</HTML>
请有人帮忙,这让我发疯了!
您在第23行和第29行缺少'='符号, result false;
应该是result = false;
提示:您可以在浏览器的开发人员控制台中检查js错误。
更新:好的,当我对其进行测试时,以下工作正常:
<html>
<head>
<title>Exam entry</title>
<script lanuage="javascript" type="text/javascript">
var result = true;
function validateForm() {
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.ExaminationNumber.value == "") {
msg + ("You must enter the Examination Number \n");
document.ExamEntry.ExaminationNumber.focus();
document.getElementById('ExaminationNumber').style.color = "red";
result = false;
}
if (msg == "") {
return result;
}
{
alert(msg)
return result;
}
}
</script>
</head>
<body>
<h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html">
<table style="width: 50%;" 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>
<tr>
<td id="ExaminationNumber">ExaminationNumber</td>
<td>
<input type="text" name="ExaminationNumber" /></td>
</tr>
<tr>
<td>
<input type="submit" name="Submit" value="Submit" onclick="return validateForm();" /></td>
<td>
<input type="reset" name="Reset" value="Reset" /></td>
</tr>
</table>
</form>
</body>
</html>
您的问题中的代码段失败的原因有几个。 让我指出一些缺陷:
document.ExamEntry
无效。 正确的是document.forms['ExamEntry']
document.ExamEntry.subject
东西是不可能的。 链接子节点不起作用。 必须使用提供的DOM方法遍历DOM。 我建议阅读诸如http://net.tutsplus.com/tutorials/javascript-ajax/javascript-and-the-dom-series-lesson-1/ 我已经修改了JavaScript,并添加了jsFiddle来使验证工作。 这是一个快速修复。 我添加了一个名为getInputByName
的辅助函数:
<script type="text/javascript">
function getInputByName(inputName) {
var inputs = document.getElementsByTagName('input');
for (var i = 0, ii = inputs.length, input; i < ii, input = inputs[i]; i++) {
if (input.name === inputName) {
return input
}
}
return false;
}
function validateForm() {
var result = true;
var msg="";
if (getInputByName('name').value=="") {
msg+="you must enter your name \n";
getInputByName('name').focus();
document.getElementById('name').style.color="red";
result = false;
}
if (getInputByName('subject').value=="") {
msg+("You must enter the subject \n");
getInputByName('subject').focus();
document.getElementById('subject').style.color="red";
result = false;
}
if (getInputByName('ExaminationNumber').value=="") {
msg+("You must enter the Examination Number \n");
getInputByName('ExaminationNumber').focus();
document.getElementById('ExaminationNumber').style.color="red";
result = false;
}
if (msg == ""){
return result;
} else {
alert(msg)
return result;
}
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.