jquery validate 中修改验证成功后的样式,数据验证成功后再修改为不通过,错误信息能出,样式却显示成功
html代码<title>无标题文档</title><scripttype="text/javascript"src="js/jquery.js"></script><s...
html代码
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/Validate.message_cn.js"></script>
<script type="text/javascript" src="js/regcheck.js"></script>
<style type="text/css">
label.error{
width:285px;
height:30px;
background:red;
line-height:30px;
padding:5px 0 5px 45px;
}
label.checked{
width:285px;
height:30px;
background:green;
line-height:30px;
padding:5px 0 5px 45px;
}
</style>
</head>
<body>
<div id="reg_con">
<form action="" method="post" id="RegistForm">
<table>
<tr>
<td class="right">会员名:</td>
<td><input type="text" class="text" name="username" /></td>
</tr>
<tr>
<td class="right">登录密码:</td>
<td><input type="text" class="text" name="password" /></td>
</tr>
<tr>
<td class="right">确认密码:</td>
<td><input type="text" class="text" name="repassword"/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" class="reg_submit cursor" value="注册" /></td>
<tr>
</table>
</form>
</div>
</body>
regcheck.js代码 其他js都是通用的
$(function(){
$("#RegistForm").validate({
debug:true,
event:"keyup" || "blur",
//手动设置错误信息的显示方式
errorPlacement: function(error, element) {
error.appendTo(element.parent());
},
rules:{
username:{
required:true,
minlength: 5
},
password:{
required: true,
minlength: 6
},
repassword:{
required: true,
minlength: 6,
equalTo: "input[name=password]"
}
},
messages:{
username:{
required:"不输入用户名你怎么登陆?",
minlength:"会员名至少5位!"
},
password:{
minlength:"为了您账号的安全,密码至少设置6位!"
},
repassword:{
required:"请再次确认密码!",
minlength:"为了您账号的安全,密码至少设置6位!",
equalTo:"两次密码必须输入一致!"
}
},
success: function(label) {
label.html(" ").addClass("checked");
}
});
})
不清楚可以加QQ570176695 解决再加100分,拜谢 展开
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/Validate.message_cn.js"></script>
<script type="text/javascript" src="js/regcheck.js"></script>
<style type="text/css">
label.error{
width:285px;
height:30px;
background:red;
line-height:30px;
padding:5px 0 5px 45px;
}
label.checked{
width:285px;
height:30px;
background:green;
line-height:30px;
padding:5px 0 5px 45px;
}
</style>
</head>
<body>
<div id="reg_con">
<form action="" method="post" id="RegistForm">
<table>
<tr>
<td class="right">会员名:</td>
<td><input type="text" class="text" name="username" /></td>
</tr>
<tr>
<td class="right">登录密码:</td>
<td><input type="text" class="text" name="password" /></td>
</tr>
<tr>
<td class="right">确认密码:</td>
<td><input type="text" class="text" name="repassword"/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" class="reg_submit cursor" value="注册" /></td>
<tr>
</table>
</form>
</div>
</body>
regcheck.js代码 其他js都是通用的
$(function(){
$("#RegistForm").validate({
debug:true,
event:"keyup" || "blur",
//手动设置错误信息的显示方式
errorPlacement: function(error, element) {
error.appendTo(element.parent());
},
rules:{
username:{
required:true,
minlength: 5
},
password:{
required: true,
minlength: 6
},
repassword:{
required: true,
minlength: 6,
equalTo: "input[name=password]"
}
},
messages:{
username:{
required:"不输入用户名你怎么登陆?",
minlength:"会员名至少5位!"
},
password:{
minlength:"为了您账号的安全,密码至少设置6位!"
},
repassword:{
required:"请再次确认密码!",
minlength:"为了您账号的安全,密码至少设置6位!",
equalTo:"两次密码必须输入一致!"
}
},
success: function(label) {
label.html(" ").addClass("checked");
}
});
})
不清楚可以加QQ570176695 解决再加100分,拜谢 展开
1个回答
展开全部
确实不太明白?这样
$(function(){
var validator = $("#RegistForm").validate({
debug:true,
event:"keyup" || "blur",
//手动设置错误信息的显示方式
errorPlacement: function(error, element) {
error.appendTo(element.parent());
},
rules:{
username:{
required:true,
minlength: 5
},
password:{
required: true,
minlength: 6
},
repassword:{
required: true,
minlength: 6,
equalTo: "input[name=password]"
}
},
messages:{
username:{
required:"不输入用户名你怎么登陆?",
minlength:"会员名至少5位!"
},
password:{
minlength:"为了您账号的安全,密码至少设置6位!"
},
repassword:{
required:"请再次确认密码!",
minlength:"为了您账号的安全,密码至少设置6位!",
equalTo:"两次密码必须输入一致!"
}
},
success: function(label) {
label.html("").addClass("checked");
}
});
$("#t").click(function(){
validator.showErrors({"username":"用户已经存在"});
});
})
html加个button
<button id="t">show error</button>
$(function(){
var validator = $("#RegistForm").validate({
debug:true,
event:"keyup" || "blur",
//手动设置错误信息的显示方式
errorPlacement: function(error, element) {
error.appendTo(element.parent());
},
rules:{
username:{
required:true,
minlength: 5
},
password:{
required: true,
minlength: 6
},
repassword:{
required: true,
minlength: 6,
equalTo: "input[name=password]"
}
},
messages:{
username:{
required:"不输入用户名你怎么登陆?",
minlength:"会员名至少5位!"
},
password:{
minlength:"为了您账号的安全,密码至少设置6位!"
},
repassword:{
required:"请再次确认密码!",
minlength:"为了您账号的安全,密码至少设置6位!",
equalTo:"两次密码必须输入一致!"
}
},
success: function(label) {
label.html("").addClass("checked");
}
});
$("#t").click(function(){
validator.showErrors({"username":"用户已经存在"});
});
})
html加个button
<button id="t">show error</button>
更多追问追答
追问
显示信息并没有问题,只是样式出问题了,麻烦把代码运行下行吗
追答
从哪判断我没运行过?我这测试没有问题。这限制了长度不能贴出全部代码,不够就是加了上面改动,如图
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询