有人可以看到我的错误表单验证?我正在使用我在网上找到的一个例子,它不适合我。使用JQuery验证HTML表单
我想验证与jQuery的输入字段,然后将其传递到服务器端脚本。它应该在用户缺少输入的字段旁边打印错误消息。
下面的代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Register</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-5">
<link rel="stylesheet" type="text/css" href="style1.css" />
<link rel="stylesheet" type="text/css" href="forms.css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#registerform").validate({
rules: {
username: "required",
firstname: "required",
email: {// compound rule
required: true,
passwd: true,
email: true,
},
username:{
username: true
},
url: {
url: true
},
comment: {
required: true
}
},
messages: {
comment: "Please enter a comment."
}
});
});
</script>
<style type="text/css">
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
</head>
<body>
Please register below
<p />
<form action=" " id="registerform" method="POST">
<table cellspacing="9">
<tr><td><b>Username:</b></td><td><input type="text" name="username" size="30"></td></tr>
<tr><td><b>First name:</b></td><td><input type="text" name="firstname" size="30"/></td></tr>
<tr><td><b>Surname:</b> </td><td><input type="text" name="lastname" size="30"/></td></tr>
<tr><td><b>Email : </b> </td><td><input type="text" name="email" size="30"/></td></td></tr>
<tr><td><b>Password :</b> </td><td><input type="password" name="passwd" size="30"/></td></tr>
<tr><td><b>Telephpone:</b></td><td><input type="text" name="telephone" size="30"/></td></td></tr>
<tr><td><b>House No:</b></td><td><input type="text" name="ad1" size="30"/></td></td></tr>
<tr><td><b>Street Name:</b></td><td><input type="text" name="street" size="30"/></td></tr>
<tr><td><b>Town/ City:</b></td><td><input type="text" name="town" size="30"/></td></tr>
<tr><td><b>Post code:</b></td><td><input type="text" name="pcode" size="30"/></td></tr>
</table>
<p />
<input class="submit" type="submit" value="Sign Up!" />
<input type="reset" value ="Clear Form" onClick="return confirm('Are you sure you want to reset the form?')">
</form>
</body>
下面的代码原有的代码,我从网站得到的地方,它的作品。但我似乎无法在我的代码中使用该示例。
<html>
<head>
<title>Simple Form Validation</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#form2").validate({
rules: {
name: "required",// simple rule, converted to {required:true}
email: {// compound rule
required: true,
email: true
},
url: {
url: true
},
comment: {
required: true
}
},
messages: {
comment: "Please enter a comment."
}
});
});
</script>
</head>
<body>
<form id="form2" method="post" action=""><br />
Name * <input type="text" name="name" /> <br />
E-Mail *<input type="text" name="email" /> <br />
URL <input type="text" name="url" /> <br />
Your comment * <textarea name="comment" ></textarea> <br />
<input class="submit" type="submit" value="Submit">
</form>
</body>
</html>
更新:感谢@Usman它现在的工作。还有一个问题,是否可以更改默认错误消息而不是'此字段是必填'?
谢谢
这将是一个很多其他人更容易帮助你,如果你解释它是如何不是为你工作。 –
对不起,这不是验证。它只是提交空表格。 – Julie
你有错误或......? –