Java学习者论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

手机号码,快捷登录

恭喜Java学习者论坛(https://www.javaxxz.com)已经为数万Java学习者服务超过8年了!积累会员资料超过10000G+
成为本站VIP会员,下载本站10000G+会员资源,购买链接:点击进入购买VIP会员
JAVA高级面试进阶视频教程Java架构师系统进阶VIP课程

分布式高可用全栈开发微服务教程

Go语言视频零基础入门到精通

Java架构师3期(课件+源码)

Java开发全终端实战租房项目视频教程

SpringBoot2.X入门到高级使用教程

大数据培训第六期全套视频教程

深度学习(CNN RNN GAN)算法原理

Java亿级流量电商系统视频教程

互联网架构师视频教程

年薪50万Spark2.0从入门到精通

年薪50万!人工智能学习路线教程

年薪50万!大数据从入门到精通学习路线年薪50万!机器学习入门到精通视频教程
仿小米商城类app和小程序视频教程深度学习数据分析基础到实战最新黑马javaEE2.1就业课程从 0到JVM实战高手教程 MySQL入门到精通教程
查看: 971|回复: 0

有关jQuery中表单验证的问题

[复制链接]

该用户从未签到

发表于 2011-10-9 17:20:14 | 显示全部楼层 |阅读模式
随着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("");
                        }
                    }
                });
               
        
        });
});
回复

使用道具 举报

该用户从未签到

发表于 2011-10-24 21:00:33 | 显示全部楼层
很好啊啊。。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|Java学习者论坛 ( 声明:本站资料整理自互联网,用于Java学习者交流学习使用,对资料版权不负任何法律责任,若有侵权请及时联系客服屏蔽删除 )

GMT+8, 2024-12-23 05:13 , Processed in 0.401997 second(s), 34 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表