jquery數(shù)據(jù)驗(yàn)證插件(自制,簡(jiǎn)單,練手)實(shí)例代碼
(function($) {
var defaults = {
bugColor: '#FFCCCC', //數(shù)據(jù)有誤的時(shí)候文本框顏色
color: 'white', //數(shù)據(jù)正確時(shí)候文本框顏色
type: "alert", //數(shù)據(jù)錯(cuò)誤時(shí)候提示方式 alert 彈出框方式 text 賦值span html
msg: "Msg", //數(shù)據(jù)有誤的時(shí)候提示內(nèi)容
ResOjId: 'no'// 當(dāng)test方式的時(shí)候 被賦值的標(biāo)簽 #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;
}
}
//驗(yàn)證ip是否符合格式
$.fn.RegIp = function(options) {
var rexString = /^\d{1,3}\.{1}\d{1,3}\.{1}\d{1,3}/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證座機(jī)是否符合格式
$.fn.RegTelPhone = function(options) {
var rexString = /^[0-9]+[-]?[0-9]+[-]?[0-9]$/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證手機(jī)是否符合格式
$.fn.RegMombilePhone = function(options) {
var rexString = /(^189\d{8}$)|(^13\d{9}$)|(^15\d{9}$)/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證中文是否符合格式
$.fn.RegCHZN = function(options) {
var rexString = /[\u4e00-\u9fa5]/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證decimal是否符合格式
$.fn.RegDecimal = function(options) {
var rexString = /^[0-9]+[.]?[0-9]+$/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證decimal保留一位小數(shù)是否符合格式
$.fn.RegDecimalSign = function(options) {
var rexString = /^[+-]?[0-9]+[.]?[0-9]+$/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證整數(shù)保留一位小數(shù)是否符合格式
$.fn.RegNumber = function(options) {
var rexString = /^[0-9]+$/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證各位整數(shù)保留一位小數(shù)是否符合格式
$.fn.RegNumberSign = function(options) {
var rexString = /^[+-]?[0-9]+$/;
return UiProcess(options, rexString, this)
}
//驗(yàn)證非空字符
$.fn.IsEmpty = function(options) {
var rexString = /(^.+$)|([\u4e00-\u9fa5])/;
return UiProcess(options, rexString, this)
}
})(jQuery);
調(diào)用:
<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>
相關(guān)文章
使用jQuery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊左右按鈕滑動(dòng)切換
在做web前端開(kāi)發(fā)的時(shí)候經(jīng)常遇到圖片滑動(dòng)切換特效,接下來(lái)通過(guò)本文給大家分享使用jQuery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊左右按鈕滑動(dòng)切換特效,感興趣的朋友參考實(shí)現(xiàn)代碼2017-08-08
利用jQuary實(shí)現(xiàn)文字浮動(dòng)提示效果示例代碼
文字浮動(dòng)提示效果想必大家都有見(jiàn)到過(guò)吧,下面為大家詳細(xì)介紹下使用jquery是如何做到的,感興趣的朋友可以參考下2013-12-12
多種JQuery循環(huán)滾動(dòng)文字圖片效果代碼
這篇文章主要為大家提供了多種JQuery循環(huán)滾動(dòng)文字圖片效果代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-02-02
jquery+json實(shí)現(xiàn)動(dòng)態(tài)商品內(nèi)容展示的方法
這篇文章主要介紹了jquery+json實(shí)現(xiàn)動(dòng)態(tài)商品內(nèi)容展示的方法,涉及jQuery操作及解析json格式數(shù)據(jù)的相關(guān)技巧,需要的朋友可以參考下2016-01-01
JQuery通過(guò)AJAX從后臺(tái)獲取信息顯示在表格上并支持行選中
這篇文章主要介紹了JQuery通過(guò)AJAX從后臺(tái)獲取信息顯示在表格上并支持行選中的相關(guān)資料,需要的朋友可以參考下2015-09-09
JQuery防止退格鍵網(wǎng)頁(yè)后退的實(shí)現(xiàn)代碼
有時(shí)我們需要防止退格鍵的網(wǎng)頁(yè)后退,一般情況下最好不要這么用,因?yàn)閷?duì)UX體驗(yàn)不好2012-03-03

