在提交和调用servlet之前调用javascript验证函数
在提交和调用servlet之前调用javascript验证函数
提问于 2014-10-16 18:01:41
我尝试验证表单，然后调用servlet，但失败了，因为表单没有验证。我在下面粘贴了一些代码。你能在这个问题上给我一些建议和帮助吗？
function validateForm()
{
if(document.frm.username.value=="")
{
alert("User Name can not be left blank");
document.frm.username.focus();
return false;
}
else if(document.frm.pwd.value=="")
{
alert("Password can not be left blank");
document.frm.password.focus();
return false;
}
}<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="/LoginExample/css/style.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/JavaScript" src="/LoginExample/js/validation.js"></script>
<title>Login example</title>
</head>
<body>
<form name="loginform" action="login" method="post" onSubmit="return validateForm();">
<p> Enter user name: <input type="text" name="username"><br>
Enter password: <input name="password" type="password"><br>
<input type="submit">
</p>
</form>
<a href="register.jsp"><input type="button" value="register" name="Sign in"></a>
</body>
</html>
Stack Overflow用户
发布于 2014-10-16 18:06:05
您正在使用document.frm引用表单，但是表单的名称是loginform，而不是frm。因此，如果您希望依赖于自动创建的document属性，则需要document.loginform。
我不喜欢依赖它们。相反，您可以将表单引用传递给验证函数：
<form ... onSubmit="return validateForm(this);" ...>...and然后在函数中使用参数：
function validateForm(frm)
{
if(frm.username.value=="")
{
alert("User Name can not be left blank");
frm.username.focus();
return false;
}
else if(frm.pwd.value=="")
{
alert("Password can not be left blank");
frm.password.focus();
return false;
}
}(当然，我仍然依赖于自动属性，在本例中依赖于form对象。如果我真的想避免它们，我可以为用户名字段使用frm.querySelector("[name=username]")，为密码字段使用frm.querySelector("[name=password]")。所有现代浏览器和IE8都有querySelector。但至少只依赖表单上的内容要比担心所有被转储到document上的内容更受控制。)
下面是您的表单和上面的代码片段，其中的操作被修改为将您带到google.com (方法被修改为GET；这两个mod都只是为了演示)：尝试使用空白的用户名或密码，您将注意到表单不会提交：
function validateForm(frm)
{
if(frm.username.value=="")
{
alert("User Name can not be left blank");
frm.username.focus();
return false;
}
else if(frm.pwd.value=="")
{
alert("Password can not be left blank");
frm.password.focus();
return false;
}
}<form name="loginform" action="http://google.com/search?q=kittens" method="get" onSubmit="return validateForm(this);">
<p> Enter user name: <input type="text" name="username"><br>
Enter password: <input name="password" type="password"><br>
<input type="submit">
</p>
</form>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26401516
复制相关文章
相似问题
腾讯云开发者
