當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

页面验证

發布時間：2023/12/4 编程问答 41 豆豆

生活随笔收集整理的這篇文章主要介紹了页面验证小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

例子：僅供測試

注冊帳號
密碼
重新輸入密碼
身份證號碼
銀行存款
擁有幾家世界500強企業
出生日期
下輩子出生日期

對輸入內容進行驗證

//這是把JS文件全放在了html里面? 可以把里面的JS內容分出2個JS來?? 另外身份證的驗證? 在另一文章里面
//http://www.cnblogs.com/jiandanfy/archive/2008/02/01/1061248.html
<html>
<head>
<title>簡單星空頁面驗證的例子</title>

</head>
<script>
?? ?function onBtnSave() {
?? ??? ?form = document.forms[0];
?? ??? ?if(validateForm(form)) {
?? ??? ?alert("驗證通過！");
?? ??? ?return;
?? ??? ?//?? ?var url = "<c:url value='/emclass/saveAdd.do' />";
?? ??? ?//form.action = url;
?? ??? ?//?? ?form.submit();
?? ??? ?}
?? ??? ?
?? ?}
?? ?
?? ?
?? ?
/以下是 validate.js
?? ?
?? ?function validateForm(form) {

?? ?return?? validateRequired(form);
}

function required () {

?? ?//添加或者一個新的驗證類型? 要在下面添加一個新的驗證類型? 然后去validates.js里指定的位置增加相應的驗證代碼 ?
?? ?//數組第一位是驗證類型第二位是表單元素的name 第三位是驗證不通過時彈出來的警告信息最后一個擴展
?? ?//最小長度
?? ?this.r1 = new Array("minlength","passwd", "密碼不能為空", new Function ("varName","this.minlength=1;return this[varName];"));
?? ?this.r2 = new Array("minlength","boke", "博客園帳號不能為空? ", new Function ("varName","this.minlength=1;return this[varName];"));
?? ?this.r3 = new Array("minlength","pking","身份證號碼不能為空", new Function ("varName","this.minlength=1;return this[varName];"));
?? ?this.r4 = new Array("minlength","bank","銀行存款不能為空", new Function ("varName","this.minlength=1;return this[varName];"));

?? ?//最大長度
?? ?this.r5 = new Array("maxlength","passwd", "密碼不能超過10位 ", new Function ("varName","this.maxlength=10;return this[varName];"));
?? ?//負數
?? ?this.r6 = new Array("negative","bank", "銀行存款就不要填負數了不能為負數");
?? ?//整數
?? ?this.r7 = new Array("int","company", "請務必正確填寫你所擁有的世界500強企業的數目? 此數目允許為負 ");
?? ?//實數
?? ?this.r8 = new Array("float","bank", "銀行存款小數點后可以填2位注意：不允許超過一萬? ！", new Function ("varName","this.max=5;this.min=2;return this[varName];"));
?? ?//身份證號碼
?? ?this.r9 = new Array("pking","pking", "請填寫正確的身份證號碼！");
?? ?//兩次密碼確認
?? ?this.r10 = new Array("passwd","passwd", "2次輸入的密碼不一樣","passwds");
?? ?//日期先后順序?? 數組的第二位是第一次時間? 第4位是第二次時間
?? ?this.r11 = new Array("dateOrder","birthday", "日期順序不對","birthdays");
?? ?//日期格式驗證 ?
?? ?this.r12 = new Array("date","birthday", "日期格式填寫錯誤", new Function ("varName","this.datePattern='yyyy-MM-dd';return this[varName];"));
?? ?this.r13 = new Array("date","birthdays", "日期格式填寫錯誤", new Function ("varName","this.datePattern='yyyy-MM-dd';return this[varName];"));
?? ?//帳號格式 ?
?? ?this.r14 = new Array("chn","boke", "帳號必須是中文");
?? ?this.r15 = new Array("id","boke", "注冊帳號格式應該是：字母開頭，允許5-16字節，允許字母數字下劃線");
?? ?this.r16 = new Array("email","boke", "email格式填寫錯誤");

}

?? ?
// 以下是 ? validates.js?? ?
?? ?
?? ?
? //去掉左右空格
function trim(s) {
?return s.replace( /^"s*/, "" ).replace( /"s*$/, "" );
}
//字串長度
function strLen(value){
?? ? var str,Num = 0;
?? ?
?? ? for (var i=0;i<value.length;i++){
?? ?? str = value.substring(i,i+1);
?? ?? if (str<="~") ?
?? ???? Num+=1;
?? ?? else
?? ???? Num+=2;
?? ? }
?? ?
?? ? return Num;
?}
?//判斷argvalue 字串中的每一個字符是否在規定范圍之內
function isAllDigits(argvalue) {
??????? argvalue = argvalue.toString();
??????? var validChars = "0123456789";
??????? var startFrom = 0;
??????? if (argvalue.substring(0, 2) == "0x") {
?????????? validChars = "0123456789abcdefABCDEF";
?????????? startFrom = 2;
??????? } else if (argvalue.charAt(0) == "0") {
?????????? validChars = "01234567";
?????????? startFrom = 1;
??????? } else if (argvalue.charAt(0) == "-") {
??????????? startFrom = 1;
??????? }
??????? for (var n = startFrom; n < argvalue.length; n++) {
??????????? if (validChars.indexOf(argvalue.substring(n, n+1)) == -1) return false;
??????? }
??????? return true;
??? }
?? ?
//??? 通用取值函數?? ??? ?分三類進行取值 [文本輸入框,單多選,多下拉菜單]
function getValue(field){
??????? var fType = field.type;
?????? ??? ??? ??? ?switch(fType) {
??????????? case "text":
??????????? case "hidden":
??????????? case "password":
??????????? case "file":
??????????? case "textarea": return field.value;
??????????? case "checkbox":
??????????? case "radio": return GetValueChoose(field);
??????????? case "select-one":
??????????? case "select-multiple": return GetValueSel(field);
????? ??? ??? ??? ??? ??? ??? ? }
?//取得radio,checkbox的選中數,用"0"來表示選中的個數,我們寫正則的時候就可以通過0{1,}來表示選中個數
??????? function GetValueChoose(field) {
??????????? var sValue = "";
?//取得第一個元素的name,搜索這個元素組
??????????? var tmpels = document.getElementsByName(field.name);
??????????? for(var i=0;i<tmpels.length;i++)? {
??????????????? if(tmpels[i].checked)?? {
??????????????????? sValue += "0";
????????????? ??? ??? ??? ??? ??? ??? ??? ? }
?????????? ??? ??? ??? ??? ?}
??????????? return sValue;
?????? ??? ??? ?}
??????? function GetValueSel(field){
??????????? var sValue = "";
??????????? for(var i=0;i<field.options.length;i++) {
//單選下拉框提示選項設置為value=""
????????????? if(field.options[i].selected && field.options[i].value!=""){
??????????????????? sValue += "0";
????????????? ??? ??? ??? ??? ??? ??? ? }
?????????? ??? ??? ??? ??? ?}
??????????? return sValue;
?????? ??? ??? ??? ?}
??? }

//??????????????????????????? 驗證函數?????????????????????????????????????????????? ?
function validateRequired(form) {

?? ??? ?? var isValid = true;
?? ??? ?? var focusField = null;
?? ??? ?? var i = 0;
?? ??? ?? var fields = new Array();
?? ??? ?? oRequired = new required();?? ??? ? ?
?? ??? ?? for (x in oRequired) {
?? ??? ? ??? ??? ??? ??? ?var valiType = oRequired[x][0];
?? ??? ??? ??? ??? ??? ?var field = form[oRequired[x][1]];
?? ??? ??? ??? ??? ??? ??? ?if(typeof field =="#ff0000")?? ?continue;
?? ??? ??? ??? ??? ??? ? ?? ?var value = getValue(field);?? ?
?? ??? ??? ??? ??? ??? ? ?? ??? ?var a="";

?????? ??? ??? ??? ?switch(valiType) {
??????????? case "minlength":?? ?var minlength = parseInt(oRequired[x][3]("minlength")); a=vMinlength(value,minlength);break;?? ?
??????????? case "maxlength": var maxlength = parseInt(oRequired[x][3]("maxlength")); a=vMaxlength(value,maxlength);break;
????? ??? ??? ??? ??? ?case "negative":? a=vNegative(value);break;
????? ??? ??? ??? ??? ?case "int":? a=vInt(value);break;?? ?
????? ??? ??? ??? ??? ?case "float":a=vFloat(value);break;
????? ??? ??? ? ??? ?case "idcard":a=vIdcard(value);break;
????? ??? ??? ??? ??? ?case "passwd": value2 = getValue(form[oRequired[x][3]]); a=vPasswd(value,value2);break;
????? ??? ??? ??? ??? ?case "dateOrder":? value2 = getValue(form[oRequired[x][3]]); a=vDateOrder(value,value2);break;
????? ??? ??? ??? ??? ?case "date":?? a=vDate(value);break;
????? ??? ??? ??? ??? ?case "id":?? a=vId(value);break;
????? ??? ??? ??? ??? ?case "email":?? a=vEmail(value);break;
????? ??? ??? ??? ??? ?case "chn":?? a=vChn(value);break;
????? ??? ??? ??? ??? ??? ??? ?
????? ??? ??? ??? ??? ??? ??? ? }
?? ??? ??? ??? ??? ??? ??? ?//如果驗證不通過
?? ??? ??? ??? ??? ??? ??? ?if (a) {
?? ??? ??? ??? ??? ??? ??? ??? ? if (i == 0)? focusField = field;
?? ??? ??? ??? ??? ??? ??? ??? ? fields[i++] = oRequired[x][2];
?? ??? ??? ??? ??? ??? ??? ??? ? isValid = false;
?? ??? ??? ??? ??? ??? ??? ? }
?? ??? ? ?? ? }
?? ??? ? if (fields.length > 0) {
?? ??? ???? focusField.focus();
?? ??? ???? alert(fields.join('"n'));
?? ??? ?? }
? return isValid;
}

//?? ??? ??? ??? ??? ??? ?最小長度? （不能為空）
function vMinlength(value,minlength){
if(trim(value).length < minlength)return true;
}
//?? ??? ??? ??? ??? ??? ?最大長度 ?
function vMaxlength(value,maxlength){
if(trim(value).length > maxlength)return true;
}
//?? ??? ??? ??? ??? ??? ?不能有負號
function vNegative(value){
if(trim(value).indexOf("-")!=-1)return true;
}
//?? ??? ??? ??? ??? ??? ?整數
function vInt(value) {
??????????????? if (value.length > 0) {
??????????????????? if (!isAllDigits(value))
????????????????????? return true;
??????????????????? else {
???????????????????? var iValue = parseInt(value);
???????????????????? if (isNaN(iValue) || !(iValue >= -2147483648 && iValue <= 2147483647))
????????????????????????? return true;
??????????????? ??? ??? ??? ??? ??? ??? ??? ??? ??? ?}
?????????? ??? ??? ??? ??? ??? ??? ??? }
}

//?? ??? ??? ??? ??? ?浮點數
function vFloat(value) {
??????????????? if (value.length > 0) {
??????????????????? // remove '.' before checking digits
??????????????????? var tempArray = value.split('.');
??????????????????? //Strip off leading '0'
??????????????????? var zeroIndex = 0;
??????????????????? var joinedString= tempArray.join('');
??????????????????? while (joinedString.charAt(zeroIndex) == '0') {
??????????????????????? zeroIndex++;
???????????? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? }
??????????????????? var noZeroString = joinedString.substring(zeroIndex,joinedString.length);

??????????????????? if (!isAllDigits(noZeroString))
?? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ?return true;
??????????????????? else {
?? ??? ??? ??? ??????????????? ??? ?var iValue = parseFloat(value);
?? ??? ??? ??? ???????????????? if (isNaN(iValue))
?? ??? ??? ??? ??????????????????? return true;
?? ??? ??? ????????????????????? var fMin = parseFloat(oRequired[x][3]("min"));
?? ??? ??? ????????????????????? var fMax = parseFloat(oRequired[x][3]("max"));
?? ??? ??? ????????????????????? var intValue = '';
?? ??? ??? ????????????????????? var fragValue = '';
?? ??? ??? ????????????????????? var index = value.indexOf(".");
?? ??? ??? ????????????????????? if(index==-1){
?? ??? ??? ???????????????????????? intValue = value;
?? ??? ??? ????????????????????? }else{
?? ??? ??? ???????????????????????? intValue = value.substring(0,index);
?? ??? ??? ???????????????????????? fragValue = value.substring(index+1);
?? ??? ??? ????????????????? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? }
?? ??? ??? ????????????????? ??? ??? ??? ?if(? vInt(intValue) || vInt(fragValue) )
?? ??? ??? ????????????????? ??? ??? ??? ? return true;
?? ??? ??? ?????????????????????? if (!(intValue.length <= fMax && fragValue.length <= fMin))
?? ??? ??? ???????????????????????? return true;
???????????????? ??? ??? ??? ??? ??? ??? ??? ??? ??? ?}
????????? ??? ??? ??? ??? ??? ??? ??? ? }
??? }
?? ?
?//?? ??? ??? ??? ??? ??? ?密碼確認?? ?
function vPasswd(value,value2){
if(value!=value2)return true;
}
//?? ??? ??? ??? ??? ??? ?時間順序
function vDateOrder(date1,date2){
?? ??? ??? ??? ?var _date1 = date1.split("-");
?? ??? ??? ??? ?var d1=new Date(_date1[0],_date1[1],_date1[2]);
?? ??? ??? ??? ?
?? ??? ??? ??? ?var _date2 = date2.split("-");
?? ??? ??? ??? ?var d2=new Date(_date2[0],_date2[1],_date2[2]);
?? ??? ??? ??? ?if( d1.getTime()>=d2.getTime() )
?? ??? ??? ? return true;

?? ?}

//? ??? ??? ??? ??? ? 日期驗證?? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??????? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ??? ?
function vDate(value) {
if(trim(value).length!=0){

var date = value.split("-");
var yyyy = date[0], mm = date[1], dd = date[2];
var d=new Date(yyyy,mm,dd),year=d.getFullYear(),mon=d.getMonth(),day=d.getDate();
if ( year!=yyyy || mon!=mm || day!=dd ||!isValidDate(dd, mm, yyyy) )
?? ?return true;
}
}
//日期初步驗證
function isValidDate(day, month, year) {
?? ???? if (month < 1 || month > 12) {
??????????? return false;
??????? }
??????? if (day < 1 || day > 31) {
??????????? return false;
??????? }
??????? if ((month == 4 || month == 6 || month == 9 || month == 11) &&
??????????? (day == 31)) {
??????????? return false;
??????? }
??????? if (month == 2) {
??????????? var leap = (year % 4 == 0 &&
?????????????? (year % 100 != 0 || year % 400 == 0));
??????????? if (day>29 || (day == 29 && !leap)) {
??????????????? return false;
??????????? }
??????? }
??????? return true;
}
//注冊帳號是否合法(字母開頭，允許5-16字節，允許字母數字下劃線)
function vId(value){
if( !(/^[a-zA-Z][a-zA-Z0-9_]{4,15}$/.test(value)))
return true;
}
?? ?
//驗證必需是中文
function vChn(value){
if( (/^[u4E00-u9FA5]+$/.test(value)))
?????? return true;
?}
//檢查email郵箱
function vEmail(value){
? var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((".[a-zA-Z0-9_-]{2,3}){1,2})$/;
?if( !reg.test(value))return true;
}
?? ?
?? ?
</script>
<body background="119.jpg">
<form><br><br><br>
?? ?<table align="center">
?? ??? ?
?? ??? ?<tr><td>
?? ??? ?博客園帳號</td><td>
?? ??? ?<input type="text" name="boke"></td></tr><tr><td> <br>
?? ??? ?密碼</td><td>
?? ??? ?<input type="passwd" name="passwd"></td></tr><tr><td> <br>
?? ??? ?重新輸入密碼 </td><td>
?? ??? ?<input type="passwd" name="passwds"></td></tr><tr><td> <br>
?? ??? ?身份證號碼 </td><td>
?? ??? ?<input type="text" name="pking"></td></tr><tr><td> <br>
?? ??? ?銀行存款 </td><td>
?? ??? ?<input type="text" name="bank"></td></tr><tr><td> <br>
?? ??? ?擁有幾家世界500強企業? </td><td>
?? ??? ?<input type="text" name="company"></td></tr><tr><td> <br>
?? ??? ?出生日期? </td><td>
?? ??? ?<input type="text" name="birthday"></td></tr><tr><td> <br>
?? ??? ?下輩子出生日期? </td><td>
?? ??? ?<input type="text" name="birthdays"></td></tr><br>
?? ??? ?
?? ?</table><br>

?? ?
?? ?<table align="center">
?? ?<tr>
?? ??? ?<td>
?? ??? ?<button? style="width:60px" onClick="onBtnSave()">保存</button>
?? ??? ?</td>
?? ?</tr>
</table>

</form>
</body>
</html>

轉載于:https://www.cnblogs.com/jiandanfy/archive/2008/01/25/1053170.html

總結

以上是生活随笔為你收集整理的页面验证的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

页面

上一篇： MYSQL 表的修复（不断更新）
下一篇： Oracle结构设计技巧(访问数据库象访

3atv精品不卡视频,97人人超碰国产精品最新,中文字幕av一区二区三区人妻少妇,久久久精品波多野结衣,日韩一区二区三区精品

编程问答

页面验证

總結