jquery里正则的使用方法及常用的正则验证

简介:   本文是一篇关于jquery使用正则来验证输入,及一些常用验证规则的基础文章,适合新手。假设我们的网页里有这样的一个表单: 验证 1.验证用户输入的只能是英文和数字:$("#btn").

  本文是一篇关于jquery使用正则来验证输入,及一些常用验证规则的基础文章,适合新手。

假设我们的网页里有这样的一个表单:

<input id="aijquery" type="text"> 
<button id="btn">验证</button>

 

1.验证用户输入的只能是英文和数字:

$("#btn").click(function(){ 
var $aijquery=$("#aijquery"); 
if(!/^[a-z0-9]+$/ig.test($aijquery.val())){
alert("只能数字和英文");
}
});

 

2.验证用户输入只能为数字,并且如果是小数的话,最多只能是两位小数:

$("#btn").click(function(){ 
var v=$("#aijquery").val(); 
if(!/^\d+(?:\.\d{0,2})?$/.test(v).test(v)){
alert("只能为数字,并且如果是小数的话,最多只能是两位小数");
}
});

 

3.验证电子邮箱:

$("#btn").click(function(){ 
var v=$("#aijquery").val(); 
if(!/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(v).test(v)){
alert("请输入正确的电子邮箱");
}
});

4.验证汉字:

$("#btn").click(function(){ 
var v=$("#aijquery").val(); 
if(!/^[\u4e00-\u9fa5]+$/.test(v).test(v)){
alert("请输入汉字");
}
});

 

5.判断是否为整数,可以为0:

$("#btn").click(function(){ 
var v=$("#aijquery").val(); 
if(!/^0$|^[1-9]\d*$/.test(v).test(v)){
alert("请输入整数");
}
});

  

下面是例子:

<!doctype html>
<html lang="en">
<head>
<title>jquery里常用正则的方法及演示-aijQuery.cn</title>
<script language="JavaScript" src="http://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
</head>
<body>
<DIV class="container-fluid">
  <input id="aijquery" type="text">
  <button id="btn">验证</button>
</DIV>
<script language="javascript">
$("#btn").click(function(){
      var v=$("#aijquery").val();
    //if(!/^[a-z0-9]+$/ig.test(v)){alert("只能数字和英文");}
    //if(!/^\d+(?:\.\d{0,2})?$/.test(v)){alert("只能为数字,如果有小数,最多只能两位!");}
    //if(!/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(v)){alert("请输入正确的电子邮箱");}
   //if(!/^[\u4e00-\u9fa5]+$/.test(v)){alert("请输入汉字");}
   if(!/^0$|^[1-9]\d*$/.test(v)){alert("请输入整数");}
});

</script>
</body>
</html>
View Code

 

出处:http://www.aijquery.cn

目录
相关文章
|
3月前
|
JavaScript 数据安全/隐私保护
jQuery Password Validation(密码验证)
jQuery Password Validation(密码验证)
47 3
|
7月前
|
JavaScript
jQuery如何验证复选框是否选中
jQuery如何验证复选框是否选中
32 0
|
JavaScript 数据库
Jquery 正则匹配字母、数字、-
简要简述Jquery正则基础用法
|
8月前
|
JavaScript 前端开发 数据安全/隐私保护
jQuery最方便的前端验证方式2种(非空验证与比较验证)
jQuery最方便的前端验证方式2种(非空验证与比较验证)
107 0
|
8月前
|
JavaScript 数据安全/隐私保护
jquery正则表达式验证手机号密码和姓名字段
jquery正则表达式验证手机号密码和姓名字段
|
JavaScript 新能源
jQuery验证车牌号(含新能源车牌)
jQuery验证车牌号(含新能源车牌)
96 1
|
JavaScript
jQuery鼠标离焦验证手机号码
jQuery鼠标离焦验证手机号码
48 0
|
JavaScript
jQuery验证身份证号码
jQuery验证身份证号码
59 0
|
JavaScript 前端开发
Form表单利用Jquery Validate验证以及ajax提交
Form表单利用Jquery Validate验证以及ajax提交
101 0
|
前端开发 JavaScript 程序员
【前端】使用jQuery探索正则表达时,手机号码和邮箱验证以及常用的函数
本篇文章将探索正则表达式的功能 在开发一个项目时,表单选项里,多少都会有手机号码以及邮箱选项的输入,那么除了在后端API进行值得有效验证,在前端也会对手机号码和邮箱做验证,减少对服务器得调用
101 0