JavaScript 无法正确验证表单。当未输入必填字段时，浏览器不会显示警告框，而是加载到下一页，就像用户确实输入了该字段一样。
<head>
<script type="text/javascript">
function inputValidation() {
var dateBox= document.forms["form"]["date"].value;
if (dateBox== null || dateBox== "") {
alert("Please enter an approximate date.");
return false;
}
}
</script>
</head>
<body>
<form name="form" id="form" action="add.php" onsubmit="inputValidation()" method="post">
<fieldset id="contactFields">
<legend>Client Information</legend><br>
<p id="require"><span>*</span>Required information</p><br>
<table width="291" height="158">
<tr>
<td>Approximate Date Serviced:<span>*</span></td>
<td><input type="text" name="date" id="date" size="20" maxlength="25">
</tr>
<tr>
<td>First Name:</td>
<td><input type="text" name="fName" id="fName" size="20" maxlength="25" /></td>
</tr>
<tr>
<td>Last Name:</td>
<td><input type="text" name="lName" id="lName" size="20" maxlength="25"/></td>
</tr>
</table>
<label class="blockLabel">Comments:<span>*</span><br><textarea name = "comment" id="comment" rows="5" cols="55"></textarea>
<label id="wordcountLabel" for="wordcount">
<div>Character Count:<input type="text" id="wordcount" readonly="readonly" value="0/0"></div>
</label>
</fieldset>
<div id="submit"><input text-align="center" class="button1" type="submit" value="Submit"></div>
<input text-align="center" class="button3" type="reset" value="Reset" />
</form>
</body>
有人有什么想法吗？请帮忙!
最佳答案
假设代码正常工作，只有验证不起作用 - 我的猜测是您想要如下所示的内容:
onsubmit="return inputValidation()"
完整代码:
<head>
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function inputValidation()
{
var dateBox= document.forms["form"]["date"].value;
if (dateBox== null || dateBox== "")
{
alert("Please enter an approximate date.");
return false;
}
return true;
}
</script>
</head>
<body>
<form name="form" id="form" action="add.php" onsubmit="return inputValidation()" method="post">
<fieldset id="contactFields">
<legend>Client Information</legend><br />
<p id="require"><span>*</span>Required information</p><br />
<label class="blockLabel">Approximate Date Serviced: <span>*</span><br/><input type="date" name = "date" id="date"/><br/><br/>
<label class="blockLabel">First Name: <span>*</span><br/><input type="text" name = "firstName" id="firstName"/><br/><br/>
<label class="blockLabel">Last Name: <span>*</span><br/><input type="text" name = "lastName" id="lastName"/><br/><br/>
<label class="blockLabel">Comments:<span>*</span><br/><textarea name = "comment" id="comment" rows="5" cols="55"></textarea>
<label id="wordcountLabel" for="wordcount">
<div>Character Count:<input type="text" id="wordcount" readonly="readonly" value="0/0" /></div>
</label>
</fieldset>
<div id="submit"><input text-align="center" class="button1" type="submit" value="Submit" /></div>
<input text-align="center" class="button3" type="reset" value="Reset" />
</form>
</body>
关于javascript - 表单验证无法正常工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17558958/