Jquery 中的验证问题

最新推荐文章于 2024-06-29 14:47:07 发布

置顶 ThinkingInjavaztf

最新推荐文章于 2024-06-29 14:47:07 发布

阅读量521

点赞数

文章标签： jquery exception function div action jsp

本文链接：https://blog.csdn.net/ThinkingInjavaztf/article/details/5670344

版权

　　　　随着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("");
                       }
                   }
               });


       });
});