Jquery_jquery に基づくタグインテリジェント検証実装コード-jsチュートリアル-php.cn

Jquery について学習した後、Jquery の強力な機能により、補助コードが多すぎて保守が難しいという問題が解決されました。
AutoValidate.JS

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

///
//検証メソッド v1.0、2010 年 12 月に作成- 9 完了 2010-12-16 MR. /Support type=text type=checkbox type=radio select タグ検証
//vld="***"形式検証が必要です
//vld="n*** "オプションの形式の検証
//err="***"エラー表示内容
//super="y"プロンプト情報を追加するにはを使用します。y 以外の文字を使用する場合は、同じレベルの検証グループと同じレベルのグループのラベルを変更する必要があります。最初のタグには super="y" 属性を付けることができ、他のタグには
//len= を付ける必要はありません。 ***" テキストエリアタグに使用される長さ制限
//
$(function () {
/ /通常の匿名オブジェクト
var strRegex = {};
//エラー情報匿名オブジェクト
var strError = {};
//正しい情報の匿名オブジェクト
var strRight = {};
/**パラメータ設定開始 **/
//空ではありません
strRegex.NoNull = /[^s] /;
strError.NoNull = "123、中国などの内容を入力してください。";
//Email
strRegex.Email = /^([a-zA -Z0-9_-]) @([a-zA-Z0-9_-]) ((.[a-zA-Z0- 9_-]{2,3}){1,2})$/; >strError.Email = "china@163.com などの電子メール形式を確認してください。
//Website
strRegex .Url = /^http://[A-Za-z0-9] .[A-Za-z0-9] [/=?%-&_~`@[]': !]*([^"" ])*$/;
strError.Url = "URL を確認してくださいhttp://www.jb51.net!" などの形式;
//Account
strRegex.An = /^([a -zA-Z0-9]|[_]){6,16 }$/;
strError.An = "china_56 などのアカウント形式を確認してください。 ";
//Number
strRegex.Math = /d $/;
strError.Math = "1234 などの数値形式を確認してください。 ";
//年齢
strRegex.Age = /^d{2}$/;
strError.Age = "10 歳から 99 歳までの年齢形式を確認してください。 ";
//郵便番号
strRegex.Post = /^[1-9]d{5}$/;
strError.Post = "150001 などの郵便番号形式を確認してください。 ";
//Phone
strRegex.Phone = /^((d{11})|((d{7,8})|(d{4}|d{3})-(d{ 7,8})|(d{4}|d{3})-(d{7,8})-(d{4}|d{3}|d{2}|d{1})|( d{7,8})-(d{4}|d{3}|d{2}|d{1})))$/;
strError.Phone = "電話番号の形式を確認してください。 15546503251! ";
//ID カード
strRegex.Card = /^(([1-9]d{5}[1-9]d{3}((0d)|(1[0-2] ))(([0|1|2]d)|3[0-1])((d{4})|d{3}[X,x]))|([1-9]d{5 }[1-9]d{1}((0d)|(1[0-2]))(([0|1|2]d)|3[0-1])(d{3})) )$/;
strError.Card = "230103190001010000 などの ID カードの形式を確認してください。 ";
//Money
strRegex.Price = /^([1-9]d*|0)(.d )?$/;
strError.Price = "お金の形式を確認してください。 99.98など！ ";
//Date
strRegex.Date = /((^((1[8-9]d{2})|([2-9]d{3}))([-/. _])(10|12|0?[13578])([-/._])(3[01]|[12][0-9]|0?[1-9])$)|(^ ((1[8-9]d{2})|([2-9]d{3}))([-/._])(11|0?[469])([-/._] )(30|[12][0-9]|0?[1-9])$)|(^((1[8-9]d{2})|([2-9]d{3} ))([-/._])(0?2)([-/._])(2[0-8]|1[0-9]|0?[1-9])$)|( ^([2468][048]00)([-/._])(0?2)([-/._])(29)$)|(^([3579][26]00)([ -/._])(0?2)([-/._])(29)$)|(^([1][89][0][48])([-/._])( 0?2)([-/._])(29)$)|(^([2-9][0-9][0][48])([-/._])(0?2 )([-/._])(29)$)|(^([1][89][2468][048])([-/._])(0?2)([-/._ ])(29)$)|(^([2-9][0-9][2468][048])([-/._])(0?2)([-/._])( 29)$)|(^([1][89][13579][26])([-/._])(0?2)([-/._])(29)$)|(^ ([2-9][0-9][13579][26])([-/._])(0?2)([-/._])(29)$))/; strError.Date = "1999.9.9、1999-9-9、1999.09.09 などの日付形式を確認してください。 ";
//Time
strRegex.Time = /^([0-9]|[0-1][0-9]|[2][0-3])(:|:)( [0-5][0-9])$/;
strError.Time = "23:59 などの時刻形式を確認してください。 ";
strError.Length = "入力情報の長さを確認してください。長さが以下です";
strRight.Info = "形式は正しいです。"; //空に設定できます
//ドロップダウンボックス
strRegex.DDL = "選択してください";
strError.DDL = "オプションを選択してください";
//単一checkbox
strRegex.Check = "選択してください";
strError.Check = "オプションを選択してください";
//単一ラジオチェックボックス
strRegex.Radio = "選択してください"; > strError.Radio = "オプションを選択してください";
//同じレベルのチェックボックスのグループ
strRegex.CheckGroup = "オプションを選択してください"; ;
//同じレベルのラジオチェックボックスのグループ
strRegex.RadioGroup = "選択してください";
strError.RadioGroup = "オプションを選択してください"; label
var SpanError = "

"; SpanOk = "

/**パラメータ設定終了 ** /
/* *主要 **/
//ファイルディレクトリ、最上位ディレクトリを返します。/
function FilePath() {
var file = ""
var; path = window.location.pathname.split('/');
$(path).each(function () {
file = "../" ファイル;
return file;
}
//ページ検証セルフテスト
$("#form1 [vld]").blur(function () {
RegexGether($(this));
});
// 検証処理 set
function RegexGether($ctrl) {
switch ($ctrl.attr("vld")) {
case "nonnull":
RegexNull ($ctrl);
case "年齢":
RegexInputTextAll($ctrl, strRegex.Age, strError.Age); >RegexInputTextOnly($ctrl, strRegex.Age) , strError.Age);
break;
case "date":
RegexInputTextAll($ctrl, strRegex.Date, strError.Date); ;
case "ndate":
RegexInputTextOnly($ctrl, strRegex.Date, strError.Date);
case "price":
RegexInputTextAll($ctrl, strRegex.Price) , strError.Price);
ケース "nprice":
RegexInputTextOnly($ctrl, strRegex.Price, strError.Price); 🎜>RegexInputTextAll($ctrl, strRegex.Email) , strError.Email);
break;
case "nemail":
RegexInputTextOnly($ctrl, strRegex.Email, strError.Email);ブレーク;
ケース "post":
RegexInputTextAll($ctrl, strRegex.Post, strError.Post);
ブレーク;
ケース "npost":
RegexInputTextOnly($ctrl, strRegex. Post, strError.Post);
break ;
case "card":
RegexInputTextAll($ctrl, strRegex.Card, strError.Card);
RegexInputTextOnly($ctrl, strRegex.Card) , strError.Card);
break;
case "time":
RegexInputTextAll($ctrl, strRegex.Time, strError.Time); >break;
case "ntime":
RegexInputTextOnly($ctrl, strRegex.Time, strError.Time);
case "math":
RegexInputTextAll($ctrl, strRegex) .Math, strError.Math);
break ;
case "nmath":
RegexInputTextOnly($ctrl, strRegex.Math, strError.Math); :
RegexInputTextAll($ctrl, strRegex.Url , strError.Url);
break;
case "nurl":
RegexInputTextOnly($ctrl, strRegex.Url, strError.Url); >break;
case "an":
RegexInputTextAll($ctrl, strRegex.An, strError.An);
break;
case "nan":
RegexInputTextOnly($ctrl, strRegex) .An, strError.An);
break ;
case "電話":
RegexInputTextAll($ctrl, strRegex.Phone, strError.Phone); :
RegexInputTextOnly($ctrl, strRegex.Phone) 、 strError.Phone);
case "ddl":
RegexSelect($ctrl)
case; "チェック":
RegexInputCheckBoxRadioOnly($ctrl, strError .Check);
ケース "ラジオ":
RegexInputCheckBoxRadioOnly($ctrl, strError.Check); >case "checkgroup":
RegexInputCheckBoxRadioAll($ctrl , strError.CheckGroup);
case "radiogroup":
RegexInputCheckBoxRadioAll($ctrl, strError.RadioGroup);
}
}
// タグコンテンツの null 検証
function RegexNull($ctrl) {
if (strRegex.NoNull.test($ctrl.val())) {
return RegexLen($ctrl);
}
else {
Error($ctrl, strError.NoNull);
return false;
}
}
//ピアと一連の input (type=radio) タグまたは input(type=checkbox) タグ
function RegexInputCheckBoxRadioAll($ctrl, error) {
if ($ctrl.parent().children(":checked") ).length == 0) {
if ( $ctrl.parent().children().attr("super")) {
//複数の [super='y'] が存在する可能性があります同じレベルのタグ、1 つだけを取得して return false コントロールを使用、一度実行してループから抜け出す
$ctrl.parent().children("[super='y']").each(function () {
Error($(this), error );
return
});
}
//同じレベルのタグのグループが一緒にエラー
$ctrl.parent().children("[type ='" $ctrl.attr("type") "']").each(function () {
Error($(this) 、エラー);
}
return false;
}
if ($ctrl.parent().children().attr(" )) {
$ctrl.parent().children("[ super='y']").each(function () {
Ok($(this));
return false;
});
}
else {
$ctrl.parent().children().each(function () {
Ok($(this));
}) ;
}
true を返します
}
}
//単一の input(type=radio) タグまたは input(type=checkbox) タグを検証します
function RegexInputCheckBoxRadioOnly($ctrl, error) {
if (!$ctrl.attr("checked") ) {
エラー($ctrl, エラー);
戻り値
}
else {
OK($ctrl);
}
//タグの選択、オプションの検証
function RegexSelect($ctrl) {
if ($ctrl.val() == strRegex.DDL) {
Error($ctrl, strError.DDL) ) ;
return false;
}
else {
Ok($ctrl)
return true;
}
// タグは空のコンテンツ形式を許可します検証、type=text ラベル検証
function RegexInputTextOnly($ctrl, Regex, error) {
//最初にラベルが空かどうかを検証します
if (strRegex.NoNull.test($ctrl.val() ) ) {
return RegexOtherFormat($ctrl, Regex, error);
}
else {
Ok($ctrl);
return
}
}
//ラベルを空にすることはできませんコンテンツ形式検証、type=text ラベル検証
function RegexInputTextAll($ctrl, Regex, error) {
//最初にラベルが空かどうかを検証します
if (strRegex.NoNull .test($ctrl.val())) {
return RegexOtherFormat($ctrl, Regex, error);
}
else {
Error($ctrl, error) ;
return false;
}
}
//タグコンテンツ形式検証
function RegexOtherFormat($ctrl, Regex, error) {
if (Regex.test($ctrl. val())) {
return RegexLen($ctrl);
else {
Error($ctrl, error);
}
//テキストエリアのタグ長検証
function RegexLen($ctrl) {
//タグに len 属性があるかどうか
if ($ctrl.attr("len")) {
var error = strError.Length $ctrl.attr("len") "単語! ";
if (parseInt($ctrl.val().length) > parseInt($ctrl.attr("len"))) {
Error($ctrl, error);
return false ;
}
}
Ok($ctrl);
return true;
}
//フォーマット検証エラー表示
function Error($ctrl, error) {
//タグ内にerr属性があるので、属性内容に従ってタイトルを記入
if ($ctrl.attr("err")) {
error = $ctrl.attr("err ");
}
if ($ctrl.attr("super")) {
//スーパー属性タグでスパンを追加
$ctrl.parent().find("span") .remove();
$ctrl.parent().append(SpanError);
$ctrl.parent().find("span").append(error); ).find("span").fadeTo("slow", 0.66);
}
else {
//タイトル属性に追加
$ctrl.attr("title", error );
$ctrl.addClass("error");
}
}
//形式検証は正しい、エラースタイルをクリア
function Ok($ctrl) {
/ /考えられるエラーを削除スタイル
if ($ctrl.attr("super")) {
$ctrl.parent().find("span").remove();
}
else {
$ctrl.removeClass("error");
}
if ($.trim($ctrl.val()).length > 0) {
var right = strRight.Info ;
// タグにリグ属性があるかどうかを確認します
if ($ctrl.attr("rig")) {
right = $ctrl.attr("rig"); }
//正しいプロンプト情報を追加します
if ($ctrl.attr("super")) {
$ctrl.parent().append(SpanOk); .find("スパン") .append(right);
$ctrl.parent().find("スパン").fadeTo("遅い",0.99).fadeTo("遅い",0.99).fadeTo( "slow",0);
}
else {
$ctrl.attr("title", right)
}
}
}
// 自己送信-test
$(" #vldBtn").click(function () {
$("#form1 [vld]").each(function () {
RegexGether($(this));
});
//タグ内のスタイルに誤りがあるかどうかを確認します
if ($("#form1 [vld][class='error']").length > 0 ) {
return false;
}
else {
return true;
}
}); htm

コードをコピー

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