formValidator表單驗證

来源:http://www.cnblogs.com/ww-ervin-72/archive/2016/01/06/5107877.html
-Advertisement-
Play Games

html部分: formValidator 用戶名: 密碼: 重覆密碼: 性別: 男 女 地區:...


html部分:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>formValidator</title>
<script src="js/jquery-1.11.1.js"></script>
<script src="js/formValidator-4.0.1.min.js"></script>
<script src="js/DateTimeMask.js"></script>
<script src="js/formValidatorRegex.js"></script>
<link rel="stylesheet" href="css/validator.css">
<style>
form{
width: 500px;
margin: 100px auto;
}
table tr td:first-child{
text-align: right;
}
table tr td{
padding: 5px 0;
}
div{
margin-left: 10px;
padding: 0 10px;
}
</style>
</head>
<body>
<form name="myfm" id="myfm" action="1.html">
<table>
<tbody>
<tr>
<td><label for="uname">用戶名:</label></td>
<td><input type="text" id="uname" name="uname"/></td>
<td><div id="unameTip"></div></td>
</tr>
<tr>
<td><label for="pwd">密碼:</label></td>
<td><input type="password" id="pwd" name="pwd"/></td>
<td><div id="pwdTip"></div></td>
</tr>
<tr>
<td><label for="repwd">重覆密碼:</label></td>
<td><input type="password" name="repwd" id="repwd"/></td>
<td><div id="repwdTip"></div></td>
</tr>
<tr>
<td><label>性別:</label></td>
<td>
<input type="radio" name="sex" value="male" id="male"/>
<label for="male">男</label>
<input type="radio" name="sex" value="female" id="female"/>
<label for="female">女</label>
</td>
</tr>
<tr>
<td><label for="area">地區:</label></td>
<td>
<select name="area" id="area">
<option value="0">- 請選擇 -</option>
<option value="1">錦江區</option>
<option value="2">金牛區</option>
<option value="3">龍泉驛區</option>
<option value="4">青羊區</option>
</select>
</td>
</tr>
<tr>
<td><label for="num">身份證:</label></td>
<td><input type="text" id="num" name="num"/></td>
<td><div id="numTip"></div></td>
</tr>
<tr>
<td><label for="phone">電話號碼:</label></td>
<td><input type="text" name="phone" id="phone"/></td>
<td><div id="phoneTip"></div></td>
</tr>
<tr>
<td><label for="email">郵箱:</label></td>
<td><input type="text" name="email" id="email"/></td>
<td><div id="emailTip"></div></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="submit" id="submit" value="提交"/></td>
<td></td>
</tr>
</tbody>
</table>
</form>
<script>
$.formValidator.initConfig({ //用於配置當前formValidator插件
formID:"myfm",
debug:false,
submitOnce:true,
validatorGroup : '1', //設置驗證組,預設值為1
onSuccess : function(){ //驗證成功後的回調函數

},
onError:function(){ //驗證失敗後的回調函數

}
});
$('#uname').formValidator({
ValidatorGroup : '1', //驗證組為1
onEmpty : '用戶名不能為空', //提示用戶名不能為空
onShow : "",
onFocus : '用戶名必須為1到12位的數字或字母',//表單元素獲得焦點的時候提示應輸入的格式
onCorrect : '用戶名輸入正確' //輸入正確的提示
})
.regexValidator({
regExp : '^[0-9a-zA-Z]{1,12}$', //驗證表單輸入的正則表達式
onError : '用戶名格式有誤,請從新輸入' //輸入錯誤的提示
})
.ajaxValidator({ //驗證輸入的用戶名是否已經存在
dataType : 'html', //請求數據的格式
async : true, //非同步方式
url : 'test.php',
success : function(data){
if (data=='false') {
return false;
}else{
return true;
}
},
onError : '該用戶名已存在,請從新輸入',
onWait : '正在對用戶名進行合法性校驗,請稍候...'
});
$('#pwd').formValidator({
ValidatorGroup : '1',
onEmpty : '密碼不能為空',
onShow : "",
onFocus : '密碼必須為6位以上的字母或數字',
onCorrect : '密碼輸入正確'
})
.regexValidator({
regExp : '[0-9a-zA-Z]{6,}',
onError : '密碼格式有誤,請從新輸入'
});
$('#repwd').formValidator({
ValidatorGroup : '1',
onEmpty : '密碼不能為空',
onShow : "",
onFocus : '密碼必須為6位以上的字母或數字',
onCorrect : '密碼輸入正確'
})
.regexValidator({
regExp : '^[0-9a-zA-Z]{6,}$',
onError : '密碼格式不正確'
})
.compareValidator({ //比較兩次輸入內容是否符合下麵給出的比較符號
desID : 'pwd', //相比較的表單元素的ID值
operateor : '=', //要比較的兩個元素之間的關係
onError : '兩次密碼輸入不一致,請從新輸入' //不滿足以上關係的時候的提示
});
$('#num').formValidator({
ValidatorGroup : '1',
onEmpty : '身份證不能為空',
onShow : '',
onFocus : '請輸入您的身份證號',
onCorrect : '身份證格式正確'
}).regexValidator({
regExp : '^[1-9]\\d{5}[1-9]\\d{3}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])\\d{4}$',
//15位身份證號碼的正則表達式/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/
onError : '身份證格式有誤,請從新輸入'
});
$('#phone').formValidator({
ValidatorGroup : '1',
onEmpty : '手機號碼不能為空',
onShow : '',
onFocus : '請輸入您的手機號碼',
onCorrect : '手機號碼格式正確',
})
.regexValidator({
regExp : '^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$',
onError : '手機號碼格式有誤,請從新輸入'
});
$('#email').formValidator({
ValidatorGroup : '1',
onEmpty : '郵箱地址不能為空',
onShow : '',
onFocus : '請輸入您的郵箱地址',
onCorrect : '郵箱格式正確'
})
.regexValidator({
regExp : '^\\w+([-+.]\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$',
onError : '郵箱格式有誤,請從新輸入'
});
</script>
</body>
</html>

php部分代碼:

<?php
header('Content-Type:html');
$name=array('Tom','ervin','Jhon');
$uname=$_REQUEST['uname'];
$notexit='true';
for ($i=0; $i <3 ; $i++) {
if ($uname==$name[$i]) {
$notexit='false';
break;
}else{
}
}
echo "$notexit";
?>


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 原文鏈接地址:http://www.cnblogs.com/lyhabc/p/3886402.html 一步一步走來已經寫到了第十六篇了~ 這一篇主要介紹MYSQL的優化,優化MYSQL資料庫是DBA和開發人員的必備技能 MYSQL優化一方面是找出系統瓶頸,提高MYSQL資料庫整體性能;另一方面需要...
  • 設置標題欄背景1> 準備背景圖片:background_pix.png註:用背景圖片比用顏色好處,可以讓背景看起來有凹凸感.2> drawable文件夾下放xml文件bitmap_repeat.xml 3> 定義樣式文件style.xml4> 在manifest.xml中引用主題android:th...
  • 筆者近2天在 Android Studio上玩了一下百度地圖,碰到了常見的"230錯誤 APP Scode校驗失敗",下麵我來介紹一下具體的解決辦法. 1.在andriodstudio上部署百度地圖的規範.把下載下來的SDK解壓,切換至Project視圖.複製以下3個文件到libs文件下. 2......
  • 2013年谷歌推出android studio後,單獨支持android開發,這是基於Java語言集成開發環境IntelliJ搭建的IDE。特別在android studio1.0穩定版出來後,谷歌將其作為官方的開發工具,也推薦開發者使用android studio。15年時候谷歌宣佈停止對ec.....
  • 前端開發在最近幾年逐漸走紅,越來越多的開發者加入前端開發隊伍。但前端在大學中沒有課程體系,而且知識也在不斷更新著。大家對它的認識也各不相同。博主有過技術經理,項目經理,面試官,前端開發的經歷,參與過較多的前端開發項目,也結識了較多前端開發人員。基於這些因素我對前端有些較深刻的認識,和大家分享下。本文...
  • 一、數組和對象操作1. $.each——遍歷$.each(obj,function(param1,param2))遍曆數組時:param1為元素序號,param2為元素內容;遍歷對象時:param1為元素屬性名,param2為元素屬性值。例如:①遍曆數組:$(function () { ...
  • 使用縮寫可以幫助減少你CSS文件的大小,更加容易閱讀。css縮寫的主要規則如下: 顏色 16進位的色彩值,如果每兩位的值相同,可以縮寫一半,例如: #000000可以縮寫為#000;#336699可以縮寫為#369; 盒尺寸 通常有下麵四種書寫方法:property:value1; 表示所...
  • 儘量避免使用DOM。當需要反覆使用DOM時,先把對DOM的引用存到JavaScript本地變數里再使用。使用設置innerHTML的方法來替換document.createElement/appendChild()方 法。eval()有問題,new Fuction()構造函數也是,儘量避免使用它們。...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...