jquery.validate() 如何控制提交? 10
用jQuery做表单验证,验证消息可以成功显示,但是就算有错误的验证提示,照样可以提交表单信息。我想做到,如果有验证没通过就不能提交的效果。请问该如何处理?原代码如下:<...
用jQuery做表单验证,验证消息可以成功显示,但是就算有错误的验证提示,照样可以提交表单信息。
我想做到,如果有验证没通过就不能提交的效果。请问该如何处理?
原代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<script src="./jquery-latest.js"></script>
<script type="text/javascript" src="./jquery.validate.js"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
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>
<!-- just style-->
<script>
$(function(){
$.validator.setDefaults({
submitHandler: function(form) {
form.submit();
}
});
///手机号码规范验证
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
///主函数
$("#regist").validate({
rules:{
name:" required",
email:{
required:true,
email:true
},
phone:{
required:true,
isMobile:true
},
password:{
required:true,
minlength:5
},
confirm:{
required:true,
equalTo:"#password"
}
},
messages:{
name:"空是不行的",
email:{
required:"不能为空",
email:"请输入正确的E-mail格式"
},
phone:{
required:"不能为空",
isMobile:"请输入正确 "
},
password:{
required:"不能为空",
minlength:jQuery.format("密码不能小于{0}位数")
},
confirm:{
required:"不能为空",
equalTo:"与密码要一致"
}
}
});
});
</script>
</head>
<body>
<form action="cat.do?method=regist" method="post" id="regist">
<fieldset>
<legend>注册</legend>
<p>
<label for="name" >name : </label>
<em>*</em>
<input type="text" name="name" id="name" size="25">
</p>
<p>
<label for="password" > password :</label><em>*</em>
<input type="text" name="password" id="password" size="25">
</p>
<p>
<label for="confirm" > confirm :</label><em>*</em>
<input type="text" name="confirm" id="confirm" size="25">
</p>
<p>
<label for="email">email : </label><em> </em>
<input type="text" name="email" id="email" size="25" class="required email">
</p>
<p>
<label for="phone">cell phone: </label><em> </em>
<input type="text" name="phone" id="phone" size="25">
</p>
<p></p>
<p>
<input type="submit" value="sub" id="submit">
<input type="reset" value="reset" >
</p>
</fieldset>
</form>
</body>
</html> 展开
我想做到,如果有验证没通过就不能提交的效果。请问该如何处理?
原代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<script src="./jquery-latest.js"></script>
<script type="text/javascript" src="./jquery.validate.js"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
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>
<!-- just style-->
<script>
$(function(){
$.validator.setDefaults({
submitHandler: function(form) {
form.submit();
}
});
///手机号码规范验证
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
///主函数
$("#regist").validate({
rules:{
name:" required",
email:{
required:true,
email:true
},
phone:{
required:true,
isMobile:true
},
password:{
required:true,
minlength:5
},
confirm:{
required:true,
equalTo:"#password"
}
},
messages:{
name:"空是不行的",
email:{
required:"不能为空",
email:"请输入正确的E-mail格式"
},
phone:{
required:"不能为空",
isMobile:"请输入正确 "
},
password:{
required:"不能为空",
minlength:jQuery.format("密码不能小于{0}位数")
},
confirm:{
required:"不能为空",
equalTo:"与密码要一致"
}
}
});
});
</script>
</head>
<body>
<form action="cat.do?method=regist" method="post" id="regist">
<fieldset>
<legend>注册</legend>
<p>
<label for="name" >name : </label>
<em>*</em>
<input type="text" name="name" id="name" size="25">
</p>
<p>
<label for="password" > password :</label><em>*</em>
<input type="text" name="password" id="password" size="25">
</p>
<p>
<label for="confirm" > confirm :</label><em>*</em>
<input type="text" name="confirm" id="confirm" size="25">
</p>
<p>
<label for="email">email : </label><em> </em>
<input type="text" name="email" id="email" size="25" class="required email">
</p>
<p>
<label for="phone">cell phone: </label><em> </em>
<input type="text" name="phone" id="phone" size="25">
</p>
<p></p>
<p>
<input type="submit" value="sub" id="submit">
<input type="reset" value="reset" >
</p>
</fieldset>
</form>
</body>
</html> 展开
2个回答
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询