jquery数据验证插件(自制,简单,练手)
一:最近项目中js数据验证比较多,为了统一风格,移植复用,于是顺手封装了Jquery的插件。
(function($) {
var defaults = {
bugColor: '#FFCCCC', //数据有误的时候文本框颜色
color: 'white', //数据正确时候文本框颜色
type: "alert", //数据错误时候提示方式 alert 弹出框方式 text 赋值span html
msg: "Msg", //数据有误的时候提示内容
ResOjId: 'no'// 当test方式的时候 被赋值的标签 #id
};
function UiProcess(options, rexString, object) {
var options = $.extend(defaults, options);
var values = object.val();
if (rexString.test(values)) {
object.css("backgroundColor", options.color);
return true;
} else {
object.css("backgroundColor", options.bugColor);
if (options.type == "alert") {
alert(options.msg);
}
if (options.type == "text") {
$(options.ResOjId).html(options.msg);
}
return false;
}
}
//验证ip是否符合格式
$.fn.RegIp = function(options) {
var rexString = /^\d{,}\.{}\d{,}\.{}\d{,}/;
return UiProcess(options, rexString, this)
}
//验证座机是否符合格式
$.fn.RegTelPhone = function(options) {
var rexString = /^[-]+[-]?[-]+[-]?[-]$/;
return UiProcess(options, rexString, this)
}
//验证手机是否符合格式
$.fn.RegMombilePhone = function(options) {
var rexString = /(^\d{}$)|(^\d{}$)|(^\d{}$)/;
return UiProcess(options, rexString, this)
}
//验证中文是否符合格式
$.fn.RegCHZN = function(options) {
var rexString = /[\u4e00-\u9fa5]/;
return UiProcess(options, rexString, this)
}
//验证decimal是否符合格式
$.fn.RegDecimal = function(options) {
var rexString = /^[-]+[.]?[-]+$/;
return UiProcess(options, rexString, this)
}
//验证decimal保留一位小数是否符合格式
$.fn.RegDecimalSign = function(options) {
var rexString = /^[+-]?[-]+[.]?[-]+$/;
return UiProcess(options, rexString, this)
}
//验证整数保留一位小数是否符合格式
$.fn.RegNumber = function(options) {
var rexString = /^[-]+$/;
return UiProcess(options, rexString, this)
}
//验证各位整数保留一位小数是否符合格式
$.fn.RegNumberSign = function(options) {
var rexString = /^[+-]?[-]+$/;
return UiProcess(options, rexString, this)
}
//验证非空字符
$.fn.IsEmpty = function(options) {
var rexString = /(^.+$)|([\u4e00-\u9fa5])/;
return UiProcess(options, rexString, this)
}
})(jQuery);
调用:
<script type="text/javascript">
function submitOk() {
var interfaceNameInput = $("#<%=interfaceName.ClientID %>");
var userNameInput = $("#<%=userName.ClientID %>");
var passWordInput = $("#<%=passWord.ClientID %>");
var interfaceUrlInput = $("#<%=interfaceUrl.ClientID %>"); ;
if (!interfaceNameInput.IsEmpty({ "msg": "接口名称格式不正确!" })) { return false }
if (!userNameInput.IsEmpty({ "msg": "格式不正确!" })) { return false }
if (!passWordInput.IsEmpty({ "msg": "格式不正确!" })) { return false }
if (!interfaceUrlInput.IsEmpty({ "msg": "格式不正确!" })) { return false }
}
</script>
jquery数据验证插件(自制,简单,练手)的更多相关文章
- jquery数据验证插件
jquery数据验证插件(自制,简单,练手) 一:最近项目中js数据验证比较多,为了统一风格,移植复用,于是顺手封装了Jquery的插件. (function($) { var defaults ...
- nice-validator表单验证插件的简单使用
前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端进行),但设置前端表单校验也是至关重要的,自己写逻辑 ...
- jQuery身份证验证插件
jQuery身份证验证插件 /*! * jQuery isIDCard Plugin v1.0.0 * http://www.cnblogs.com/cssfirefly/p/5629561.html ...
- 基于jquery,bootstrap数据验证插件bootstrapValidator 教程
bootstrap:能够增加兼容性的强大框架. 因为项目需要数据验证,看bootstrapValidator 还不错,就上手一直,完美兼容,话不多说. 需要引用css: bootstrap.min.c ...
- 基于jquery,bootstrap数据验证插件bootstrapValidator
bootstrap:能够增加兼容性的强大框架. 因为项目需要数据验证,看bootstrapValidator 还不错,就上手一直,完美兼容,话不多说. 需要引用css: bootstrap.min.c ...
- 【转】基于jquery,bootstrap数据验证插件bootstrapValidator 教程
bootstrap:能够增加兼容性的强大框架. 因为项目需要数据验证,看bootstrapValidator 还不错,就上手一直,完美兼容,话不多说. 需要引用css: bootstrap.min.c ...
- python实现列表页数据的批量抓取练手练手的
python实现列表页数据的批量抓取,练手的,下回带分页的 #!/usr/bin/env python # coding=utf-8 import requests from bs4 import B ...
- 基于jquery、bootstrap的数据验证插件bootstrapValidator使用
实时验证用户名是否存在,密码不能和用户名相同,两次密码需要相同,提交之后需要验证返回值: <form id="defaultForm" role="form&quo ...
- 【转载】jquery validate验证插件,在ajax提交方式下的验证
正常的表单都是使用submit按钮来提交,jquery validate插件可以方便的做表单验证. 做一个发送短信的功能,向目标表插入多条记录,界面采用ajax来提交表单,等待效果直接用ext的遮罩 ...
随机推荐
- js onchange事件
因为onchange在属性值改变时还必须使得当前元素失去焦点(onblur)才可以激活该事件. 如果你需要即时监听输入框值的变化,建议使用 onpropertychange 事件! 在IE下,当一个H ...
- Petshop学习第三天
ASP.NET缓存 ASP.NET充分利用缓存机制,通过某种方法,将系统需要的数据对象.Web页面存储在内存中,使得Web站点需要这些数据时,不经过繁琐的数据库连接.查询和复杂的逻辑运算,就可以触手可 ...
- Struts2.x jsp页面无法使用jsp:forward跳转到action
问题:使用<jsp:forward page="test"></jsp:forward>语句无法跳转到test所对应的action. 解决办法:在web.x ...
- TFS的使用
1.http://www.kwstu.com/ArticleView/kwstu_201462311500744
- C#利用API制作类似QQ一样的右下角弹出窗体
C#利用API制作类似QQ一样的右下角弹出窗体 (2009-03-21 15:02:49) 转载▼ 标签: 杂谈 分类: .NET using System;using System.Collecti ...
- 剑指OFFER之从1到n中出现1的次数(九度OJ1373)
题目描述: 亲们!!我们的外国友人YZ这几天总是睡不好,初中奥数里有一个题目一直困扰着他,特此他向JOBDU发来求助信,希望亲们能帮帮他.问题是:求出1~13的整数中1出现的次数,并算出100~130 ...
- ECSHOP在线手册布局参考图--商品分类页 category.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- JavaScript要点(七) 函数调用
JavaScript 函数有 4 种调用方式. 每种方式的不同方式在于 this 的初始化. this 关键字 注意: this 是保留关键字,你不能修改 this 的值. ⚠️一般而言,在Java ...
- SQLite使用教程4 创建数据库
http://www.runoob.com/sqlite/sqlite-create-database.html SQLite 创建数据库 SQLite 的 sqlite3 命令被用来创建新的 SQL ...
- mysql之存储引擎
1.存储引擎概念 打比方说:一部电影有mp4,wmv,avi,flv...等格式.同样的一部电影在硬盘上有不同的存储格式,所占的空间与清晰程度也各不一样. 那么我们表里的数据存储在硬盘上,是如何存储的 ...