php 自动验证 正则表达,使用正则表达式验证登录页面的输入内容

这篇文章主要介绍了使用正则表达式验证登录页面输入是否符合要求的实例代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下

先给大家展示下效果图:

3e718d1829109e0ede6897228f62717e.png

废话不多说了,直接给大家贴代码了,具体代码如下所示:

$(function() {

$("input[name='uname']").blur(function() { //失去焦点

var namestr = $(this).val();

var regstr = /^[\u4e00-\u9fa5]{2,4}$/;

if(!regstr.test(namestr)) {

$(this).parent().next().html("用户名必须是2-4个汉字").css("color", "red");

return false;

}

return true;

});

$("input[name = 'uname']").focus(function() { //获取焦点

$(this).val("");

$(this).parent().next().html("");

});

$("input[name='pwd']").blur(function() {

var pwdstr = $(this).val();

var regstr = /^\w{6}$/;

if(!regstr.test(pwdstr)) {

$(this).parent().next().html("密码必须是6位数字字母下划线").css("color", "red");

return false;

}

return true;

});

$("input[name='pwd']").focus(function() {

$(this).parent().next().html("");

});

$("input[name='birthday']").blur(function() {

var birthdaystr = $(this).val();

var regstr = /^(19|20)\d{2}-(1[0-2]|0?[1-9])-(3[0-1]|2[0-9]|0?[1-9])$/;

if(!regstr.test(birthdaystr)) {

$(this).parent().next().html("日期格式不正确").css("color", "red");

return false;

}

return true;

});

$("input[name='birthday']").focus(function() {

$(this).parent().next().html("");

});

$("input[name='email']").blur(function(){

var emailstr = $(this).val();

var regstr = /^[\w\-]+@[a-z0-9A-Z]+(\.[a-zA-Z]{2,3}){1,2}$/;

if(!regstr.test(emailstr)){

$(this).parent().next().html("邮箱格式不正确").css("color","red");

return false;

}

return true;

});

$("input[name='email']").focus(function(){

$(this).parent().next().html("");

});

});

body {

font-size: 12px;

}

#home {

background-color: beige;

border: solid 1px black;

width: 550px;

height: 185px;

margin: auto;

margin-top: 20px;

}

#head {

height: 135px;

}

#foot {

text-align: center;

}

.dl1 {

clear: both;

padding-left: 10px;

}

.dl1 dt {

float: left;

height: 30px;

width: 80px;

line-height: 30px;

}

.dl1 dd {

float: left;

height: 30px;

line-height: 30px;

/*width: 250px;*/

}

#btn_res {

background-image: url(img/reset.gif);

width: 80px;

height: 34px;

}

#btn_sub {

background-image: url(img/submit.gif);

width: 80px;

height: 34px;

}

用户名 :
用户密码 :
出生日期 :
yyyy-mm-dd
用户邮箱 :
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值