JS输入框正则校验
1. 开发中需要对etl组件统一进行input输入框校验,允许为空,可以不校验,默认校验长度和特殊字符,代码如下,记录以备复用。
/**
* 数据值校验工具类
*/
var checkService = {
// 不校验
none: function () {
return true;
}, //非空校验
isEmpty:function (str) {
if (str == null || str == "") return false;
},
// 只能输入数字[0-9]
isDigits: function (str) {
if (str == null || str == "") return true;
var reg = /^\d+$/;
return reg.test(str);
}, // 匹配english
isEnglish: function (str) {
if (str == null || str == "") return true;
var reg = /^[A-Za-z]+$/;
return reg.test(str);
}, // 匹配integer(包含正负)
isInteger: function (str) {
if (str == null || str == "") return true;
var reg = /^[-\+]?\d+$/;
return reg.test(str);
}, // 匹配汉字
isChinese: function (str) {
if (str == null || str == "") return true;
var reg = /^[\u4e00-\u9fa5]+$/;
return reg.test(str);
}, // 匹配中文(双字节字符,包括汉字和符号)
isChineseChar: function (str) {
if (str == null || str == "") return true;
var reg = /^[\u0391-\uFFE5]+$/;
return reg.test(str);
}, // 匹配URL
isUrl: function (str) {
if (str == null || str == "") return true;
var reg = /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\’:+!]*([^<>\"])*$/;
return reg.test(str);
}, // 字符验证,只能包含中文、英文、数字、下划线、空格。
stringCheck: function (str) {
if (str == null || str == "") return true;
var reg = /^[a-zA-Z0-9\u4e00-\u9fa5_ ]+$/;
return reg.test(str);
}, //字符长度校验(最长64位)
stringLengthCheck: function (str, length) {
if (str == null || str == "") return true;
length = length || 64;
if (str.length > length) return false;
return true;
},
//IP格式验证
isIP: function (str) {
if (str == null || str == "") return true;
var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
return reg.test(str);
}
};
2. 给需要校验的input加上[data-vaild]属性:
data-valid=“校验函数名1 校验函数名2”(多种校验,校验名以空格区分)
- html中给每个带有data-attribute属性的input元素绑定data-valild属性:
<input id="limit" type="number" data-attribute="limit" value="0" class="width-100" data-valid="isDigits stringLengthCheck"/>
- js中给input框绑定blur函数:
/**
* 添加校验
* @param $div
*/
StencilsEditor.prototype.bindCheck = function ($div) {
//添加input校验
$div.find("input[data-attribute]").on('blur', function () {
var $this = $(this);
var val = $this.val();
var valid = $this.data("valid") || "stringCheck stringLengthCheck";
var valids = valid.split(" ")
for (var i in valids) {
var check = valids[i];
if (!checkService[check](val)) {
$this.addClass("has-error");
$this.data("errorMsg", "errorMsg_" + check);
break;
}
$this.removeClass("has-error");
}
});
};
JS输入框正则校验的更多相关文章
- js电话号码正则校验--座机和手机号
1.最新的电话号码段: 移动:134(1349除外)135 136 137 138 139 147 150 151 152 157 158 159 182 183 184 187 188 联通: 13 ...
- JS通过正则限制 input 输入框只能输入整数、小数(金额或者现金)
第一: 限制只能是整数 <input type = "text" name= "number" id = 'number' onkeyup= " ...
- js前台传数组,java后台接收转list,前后台用正则校验
前台,传参数时,将数组对象转换成json串,后台java收到后用 JSONArray.fromObject 转成集合. 前台js:var params = {"FileNameList&qu ...
- AngularJS进阶(十三)JS利用正则表达式校验手机号
JS利用正则表达式校验手机号 注:请点击此处进行充电! 绪 由于项目需求,需要在前端实现手机号码的校验.当然了,对于基本的格式校验应该放在客户端进行,而不需要再将待校验的手机号发送至服务端,在服务端完 ...
- 正则校验:微信号,qq号,邮箱
java判断微信号.手机.名字的正则表达 - willgos - 博客园https://www.cnblogs.com/solossl/p/5813106.html 微信号正则校验,qq正则,邮箱正则 ...
- 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验
转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...
- RegExp正则校验之Java及R测试
前言: 正则表达式(英语:Regular Expression)原属于计算机科学的一个概念.正则表达式使用单个字符串来描述.匹配一系列符合某个句法规则的字符串.在很多文本编辑器里边,正则表达式通常被用 ...
- JS输入框邮箱自动提示(带有demo和源码)(转载)
今天在javascriptQQ群里面 有童鞋问到 有没有 "JS输入框邮箱自动提示"插件,即说都找遍了github上源码 都没有看到这样类似的插件,然后我想了下 "JS输 ...
- JS利用正则配合replace替换指定字符
替换指定字符的方法有很多,在本文为大家详细介绍下,JS利用正则配合replace是如何做到的,喜欢的朋友可以参考下 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一 ...
随机推荐
- CentOS防火墙配置
1.查询防火墙状态 service iptables status 2.开启防火墙 service iptables start 3.关闭防火墙 service iptables stop 4.重启防 ...
- 使用new Image()进行预加载
概述 这篇博文记录了用new Image()进行预加载的总结,供以后开发时参考,相信对其他人也有用. 旧的预加载 一般我们为了让背景图更快的加载,我们常常把背景图放在一个display:none的im ...
- css3 动画与display:none冲突的解决方案
概述 css不能在display:none和display:block之间进行动画,并且也不能在height:0和height:auto之间进行动画.这里我研究了一下在display:none和dis ...
- Java学习笔记40(缓冲流)
缓冲流: 在读写文件的各种流中,最令人烦恼的就是效率问题, 而缓冲流的目的就是提高读写效率 字节输出缓冲流: package demo; import java.io.BufferedOutputSt ...
- 上下文无关的GMM-HMM声学模型
一.语音识别基本介绍 (一)统计语音识别的基本等式 X------声学特征向量序列,观测值 W------单词序列 W*------给定观测值下,概率最大的单词序列 应用贝叶斯理论等价于 进而得出统计 ...
- VueRouter 源码深度解析
VueRouter 源码深度解析 该文章内容节选自团队的开源项目 InterviewMap.项目目前内容包含了 JS.网络.浏览器相关.性能优化.安全.框架.Git.数据结构.算法等内容,无论是基础还 ...
- Flask源码复习之路由
构建路由规则 一个 web 应用不同的路径会有不同的处理函数,路由就是根据请求的 URL 找到对应处理函数的过程. 在执行查找之前,需要有一个规则列表,它存储了 url 和处理函数的对应关系.最容易想 ...
- .NET FileUpLoad上传文件
一.上传扫描件到服务器,自定义创建文件夹(如果存在该文件夹,则无需创建),并判断格式以及文件大小进行保存: 首先创建一个保存按钮事件: protected void btnSave_Click(obj ...
- UFLDL 教程学习笔记(一)神经网络
UFLDL(Unsupervised Feature Learning and Deep Learning)Tutorial 是由 Stanford 大学的 Andrew Ng 教授及其团队编写的一套 ...
- Windows下memcache的配置和使用(python)
1.memcache的安装和配置: 下载memcache for windows: http://up.2cto.com/2012/0522/20120522094758371.rar 解压到指定目 ...