jsデータ検証セット、js電子メール検証、js URL検証、js長さ検証、jsデジタル検証およびその他の単純なpackages_form効果

以前、js データ検証、js メール検証、js URL 検証、js 長さ検証、js デジタル検証、その他のポップアップ ダイアログ ボックスを作成しましたが、そのような不親切な方法は今ではあまり普及していないので、書き直しました。 1 つ目は、カプセル化され、よりフレンドリーなレイヤー フォームが全員と共有されることです。使用中にバグがある場合は、改善するためにメッセージを残してください。

コードをコピー コードは次のとおりです:

/**
* データ検証フレームワーク。ID フィールドのチェックでエラーが発生した場合、エラー メッセージを表示するために、対応する応答の直後に
要素が追加されます。 >* @バージョン 2.1
* @説明 2009-05-16
*/
var checkData = new function() {
var idExt="_wangzi6hao_Span";//スパン層の ID サフィックスを生成します
/* *
* 中国語と英語の文字長を取得します (中国語は 2 文字です)
*
* @param {}
* str
* @return 文字の長さ
*/
this.length = function(str) {
var p1 = new RegExp('%u..', 'g')
var p2 = new RegExp('%. ', 'g')
returnscape(str).replace(p1, '').replace(p2, '').length
}
/**
* 対応する id 要素を削除
*/
これを削除 = function(id) {
var idObject = document.getElementById(id)
if (idObject != null)
idObject.parentNode.removeChild(idObject); >/ **
* 対応する id 以降のエラーメッセージ
*
* @param id: エラーメッセージを表示する必要がある id 要素
* str: エラーメッセージを表示
*/
this.appendError = function(id, str) {
this.remove(id idExt);//span 要素が存在する場合は、最初にこの要素を削除します
var spanNew = document.createElement("span"); // スパンを作成します
spanNew.id = id idExt; // spaid を生成します
spanNew.style.color = "red";
spanNew.appendChild; .createTextNode (str));// スパンにコンテンツを追加します
var inputId = document.getElementById(id);
inputId.parentNode.insertBefore(spanNew, inputId.nextSibling);// スパンを追加します
}
/**
* @description すべてのスペース文字をフィルターします。
* @param str: スペースを削除する必要がある元の文字列
* @return スペースを削除した文字列を返します
*/
this.trimSpace = function(str) {
str = "";
while ((str.charAt(0) == ' ') || (str.charAt(0) == '???')
|| (escape(str.charAt(0) )) == '%u3000'))
str = str.substring(1, str.length);
while ((str.charAt(str.length - 1) == ' ')
|| (str.charAt(str.length - 1) == '???')
|| (escape(str.charAt(str.length - 1)) == '%u3000'))
str = str.substring(0, str.length - 1);
return str;
/**
* 文字列の先頭のスペースと文字列の末尾のスペースをフィルタリングします。テキストの途中にある複数の連続したスペースを 1 つのスペースに変更します。
*
* @param {Object}
* inputString
*/
this.trim = function(inputString) {
if (typeof inputString != "string") {
return inputString;
var retValue = inputString;
while (ch == " ") {
// 文字列の先頭のスペースを確認します
retValue = retValue.substring(1, retValue.length);
ch = retValue.substring(0, 1); );
}
ch = retValue.substring(retValue.length - 1, retValue.length);
while (ch == " ") {
// の末尾のスペースを確認します文字列
retValue = retValue.substring(0, retValue.length - 1);
ch = retValue.substring(retValue.length - 1, retValue.length);
}
while (retValue) .indexOf(" ") != -1) {
// テキストの途中にある複数の連続したスペースを 1 つのスペースに変更します
retValue = retValue.substring(0, retValue.indexOf(" "))
retValue.substring (retValue.indexOf(" ") 1,
retValue.length);
return
}
/**
* フィルター文字列。フィルターの内容を指定します。内容が空の場合、デフォルトのフィルターは '~!@#$%^&*()- です。"
*
* @param {Object}
* str
* @param {Object}
* filterStr
*
* @return にはフィルターの内容が含まれており、True を返します。それ以外の場合は false を返します。*/
this.filterStr = function(str, filterString) {
filterString = filterString == "" ? "'~!@#$%^&*()- ."" : filterString
var ch;
var i;
var temp;
var error = false;// 不正な文字が含まれる場合、True
for (i = 0; i ch = filterString.charAt(i);
temp = str.indexOf(ch);
if (temp != -1) {
error = true;
}
}
エラーを返します;
}
this.filterStrSpan = function(id, filterString) {
filterString = filterString == "" "'~!@#$ %^&*( )- ."" : filterString
var val = document.getElementById(id);
if (this.filterStr(val.value, filterString)) {
val.select() ;
var str = "不正な文字を含めることはできません" filterString;
this.appendError(id, str);
} else {
this.remove(id idExt);
return true ;
}
}
/**
* URL であるかどうかを確認します
*
* @param {}
* str_url
* @return {Boolean} true: URL です、false:
ではありません URL*/
this.isURL = function(str_url) {// 検証 URL
var strRegex = "^( (https|http|ftp|rtsp|mms)?://)"
"?(([0-9a-z_!~*'().&= $%-] : )?[0-9a -z_!~* '().&= $%-] @)?" // ftp user@
"(([0-9]{1,3}.){3}[0-9] {1,3 }" // IP 形式の URL - 199.194.52.184
"|" // IP と DOMAIN (ドメイン名) を許可
"([0-9a-z_!~*'()- ] .)*" // ドメイン名 - www.
"([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]." //第 2 レベルのドメイン名
"[a-z]{2,6})" // 第 1 レベルのドメイン - .com または .museum
"(:[0-9]{1,4})?" / / Port- :80
"((/?)|" // ファイル名がない場合はスラッシュは必要ありません
"(/[0-9a-z_!~*'().; ?:@&= $,% #-] ) /?)$";
var re = new RegExp(strRegex);
return re.test(str_url);
}
これ。 isURLSpan = function(id) {
var val = document.getElementById(id);
if (!this.isURL(val.value)) {
val.select(); = "リンクが形式に準拠していません;" ;
this.appendError(id, str);
this.remove(id idExt); true を返す;
}
}
/**
* メールかどうかを確認します
*
* @param {}
* str
* @return {Boolean} true: email、false: ではありませんメール
*/
this.isEmail = function(str) {
var re = /^([a-zA-Z0- 9] [_|-|.]?) *[a-zA-Z0-9] @([a-zA-Z0-9] [_|-|.]?)*[a-zA-Z0-9 ] .[a-zA-Z]{2 ,3}$/;
return re.test(str)
}
this.isEmailSpan = function(id) {
var val = document.getElementById(id);
if (!this.isEmail(val.value)) {
val.select();
var str = "メールが形式を満たしていません;"; >this.appendError(id, str);
return false;
} else {
this.remove(id idExt);
を返します。 /**
* 数値かどうかを確認します
*
* @param {}
* str
* @return {Boolean} true: 数値、false: ではありません。 /b> 番号;*/
this.isNum = function(str) {
var re = /^[d] $/
return re.test(str);
this.isNumSpan = function(id) {
var val = document.getElementById(id);
if (!this.isNum(val.value)) {
val.select();
var str = "数値でなければなりません;";
this.appendError(id, str);
} else {
this.remove(id idExt); 🎜 >return true;
}
}
/**
* 値が指定された範囲内にあるかどうかをチェックします。値が空の場合はチェックは実行されません

*
* @param {}
* str_num
* @param { }
* small 以上である必要がある値 (この値が空の場合は、最大値を超えてはいけないことだけを確認してください)
* @param {}
* big 値以下である必要があります (この値が空の場合、チェックは最小値未満にすることはできません)
*
* @return {Boolean} 最小値未満またはそれ以上最大値よりも数値が大きい場合は false を返し、それ以外の場合は true を返します。*/
this.isRangeNum = function(str_num, small, big) {
if (!this.isNum( str_num )) // 数値かどうかを確認します
return false
if (small == "" && big == "")
throw str_num "最大値または最小値は定義されていません。";
if (small != "") {
if (str_num < small)
return false;
}
if (big != "") {
if (str_num > big)
return false;
}
return true;
}
this.isRangeNumSpan = function(id, small, big) {
var val = document. getElementById(id);
if (!this.isRangeNum(val.value, small, big)) {
val.select();
var str = ""; = "") {
str = "以下である必要があります" small
}
if (big != "") {
str = "以下である必要があります; " big;
}
this.appendError(id, str);
return false;
} else {
this.remove(id idExt);
return true;
}
}
/**
* 修飾された文字列であるかどうかを確認します (大文字と小文字は区別されません)

* は a-z0-9_
*
* @param {}
* str チェックされた文字列
* @param {}
* idStr カーソル位置のフィールド ID* @return {Boolean} No 「a-z0-9_」構成は false を返し、それ以外の場合は true を返します。*/
this.isLicit = function(str) {
var re = /^[_0-9a-zA-Z]*$/
return re.test (str);
}
this.isLicitSpan = function(id) {
var val = document.getElementById(id)
if (!this.isLicit(val) .value)) {
val.select();
var str = "a-z0-9_ で構成される文字列です (大文字と小文字は区別されません);"; );
return false;
} else {
this.remove(id idExt);
}
/**
* 2 つの文字列が等しいかどうかを確認します
*
* @param {}
* str1 最初の文字列
* @param {}
* str2 2 番目の文字列
* @ return {Boolean} 文字列が等しくない場合は false を返し、それ以外の場合は true を返します。*/
this .isEquals = function(str1, str2) {
return str1 == str2;
}
this.isEqualsSpan = function(id, id1) {
var val = document.getElementById (id);
var val1 = document.getElementById(id1);
if (!this.isEquals(val.value, val1.value)) {
val.select(); str = "二入力内容は同じである必要があります;";
this.appendError(id, str);
return false;
this.remove(id idExt); 🎜>return true;
}
}
/**
* 文字列が指定された長さの範囲内にあるかどうかをチェックします (漢字は 2 バイトとして計算されます)。文字が空の場合はチェックは実行されません。
*
* @param {}
* str チェックされた文字
* @param {}
*lessLen 以上である必要がある長さ
* @param {}
* moreLen 以下である必要がある長さ
*
* @return {Boolean} 最小長より小さい、または最大長より大きい数値は false を返します。*/
this.isRange = function(str, lessLen, moreLen) {
var strLen = this.length( str);
if (lessLen != "") {
if (strLen return false;
}
if (moreLen != "") {
if (strLen > moreLen )
return false;
}
if (lessLen == "" && moreLen == "")
throw "最大長と最小長が定義されていません!"; > true を返す;
}
this.isRangeSpan = function(id,lessLen, moreLen) {
var val = document.getElementById(id);
if (!this.isRange(val.value) 、lessLen、moreLen)) {
var str = "長さ";
if (lessLen != "")
str = "「lessLen」以上;"; moreLen != "")
str = "以下である必要があります" moreLen;
this.appendError(id, str); 🎜>} else {
this.remove( id idExt);
return true;
}
}
/**
* 文字列が指定された長さの範囲より小さいかどうかを確認します (漢字は 2 バイトとして計算されます)

*
* @param {}
* str string
* @param {}
* 長さ以下のlessLen
*
* @return {Boolean} 指定された長さの数値より小さい場合は false を返します。*/
this.isLess = function( str,lessLen) {
return this.isRange (str,lessLen, "");
}
this.isLessSpan = function(id,lessLen) {
var val = document.getElementById(id) );
if (!this.isLess( val.value,lessLen)) {
var str = "長さはlessLen以上です"
val.select(); .appendError(id, str);
return
} else {
this.remove(id idExt);
return
}
/* *
* 文字列が指定された長さの範囲より大きいかどうかを確認します (漢字は 2 バイトとして計算されます)

*
* @param {}
* str string
* @param {}
* 長さ以下の moreLen
*
* @return {Boolean} 指定された長さの数値より大きい場合
を返します。*/
this.isMore = function( str, moreLen) {
return this.isRange(str, "", moreLen);
}
this.isMoreSpan = function(id) , moreLen) {
var val = document.getElementById(id );
if (!this.isMore(val.value, moreLen)) {
var str = "長さは以下でなければなりません" moreLen;
val.select();
this.appendError (id, str);
return false;
} else {
this.remove(id idExt);
return true;
}
}
/**
* 文字が空でないことを確認します
*
* @param {}
* str
* @ {ブール値}を返す文字が空です true を返します。それ以外の場合は false;
*/
this.isEmpty = function(str) {
return str == ""; >this.isEmptySpan = function(id) {
var val = document.getElementById(id);
if (this.isEmpty(val.value)) {
var str = "空は許可されません。" ;
val.select();
this.appendError(id, str);
return false;
this.remove(id idExt); ;
}
}
}


テストページ

コードをコピー

コードは次のとおりです。