有关jQuery中表单验证的问题

随着jquery的流行越来也多的网站开始使用jquery来做网站的有特效

    为了减轻服务器端的压力 为了达到CS的那种高效 ,减轻网络流量

    对表单的验证 放在了客户端。

age:这是jsp网页其中的表单部分

<form action="ztfAction" method="post">
<table class="tabin">
<tr><td>姓名:</td><td><input type="text" name="name" id="y"/><div></div></td></tr>
<tr><td>电话:</td><td><input type="text" name="tel" id="y"/><div></div></td></tr>
<tr><td>Email:</td><td><input type="text" name="email" id="y"/><div></div></td></tr>
<tr><td>密码:</td><td><input type="password" name="pawd" id="y"/><div></div></td></tr>
<tr><td>再次输入密码:</td><td><input type="password" name="password" id="y"/><div></div></td></tr>
</table>
</form>

下面是jquery的代码

    
var passwd1;

$(document).ready(function(){
$(".tabin input").each(function(index){

$(this).focus(function(){
//当光标定位是改变输入框的颜色
$(this).css("border-color","#FF0000");
$(this).next("div").html("");

}).blur(function(){
if(index==0){
var str = $(this).val();
var reg_exception =/[a-zA-Z1-9\u4e00-\u9fa5]{1,}/;
var result = reg_exception.test(str);
if(result){
$(this).css("border-color","#54585B")
}else{
$(this).next("div").html("请输入中文 或英文 或数字");
$(this).css("border-color","#FF000000");
$(this).val("");
}
}
if(index==1){alert("与用户名的输入框验证相似")}
if(index==2){alert("与用户名的输入框验证相似")}
if(index==3){
var reg_exception =/^[A-Za-z0-9]{6,}$/;
passwd1 = $(this).val();
var result =reg_exception.test(passwd1);
if(result){
$(this).css("border-color","#404040");
}else{
$(this).css("border-color","#D70402");
$(this).next("div").html("密码必须为6-20为的数字或大小写字母");
$(this).val("");
}
}
if(index==4){
var reg_exception =/^[A-Za-z0-9]{6,}$/;
var str2 = $(this).val();
var result =reg_exception.test(str2);
if(result){
if(passwd1==str2){
$(this).css("border-color","#404040");
}else{
$(this).css("border-color","D70402");
$(this).next("div").html("两次输入的密码不一致!请重新输入");
$(this).val("");
}
}else{
$(this).css("border-color","#404040");
$(this).next("div").html("密码必须为6-20为的数字或大小写字母");
$(this).val("");
}
}
});


});
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值