jQueryフォーム検証プラグイン formValidator(改良版)

列挙オブジェクトの使用法:

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

 
//各種検証メソッド サポートされているタグのタイプ 
sustainType: function (elem, settings) { 
var srcTag = elem.tagName; 
switch (setting.validatetype) { 
case _validTypeEnum.InitValidator: 
true を返す; 
case _validTypeEnum.InputValidator: 
if (srcTag == _validTagEnum.INPUT || srcTag == _validTagEnum.TEXTAREA || srcTag == _validTagEnum.SELECT) { 
 true を返す; 
} else { 
return false; 
} 
case _validTypeEnum.CompareValidator: 
if (srcTag == _validTagEnum.INPUT || srcTag == _validTagEnum.TEXTAREA) { 
if (stype == _validTagTypeEnum.checkbox || stype == _validTagTypeEnum.radio) { 
return false; 
} else { 
return true; 
} 
return false ; 
case _validTypeEnum.AjaxValidator: 
if (stype == _validTagTypeEnum.text || stype == _validTagTypeEnum.textarea || stype == _validTagTypeEnum.file || stype == _validTagTypeEnum .select_one) { 
return true; 
} else { 
return false; 
} 
case _validTypeEnum.RegexValidator: 
if (srcTag == _validTagEnum.INPUT || srcTag == _validTagEnum.TEXTAREA) { 
if (stype == _validTagTypeEnum.checkbox || stype == _validTagTypeEnum.radio) { 
return false 
} else { 
return true; >} 
return false; 
case _validTypeEnum.FunctionValidator: 
return true; 
} 
} 

 

コードをコピー

コードは次のとおりです: //指定された文字列の長さを取得しますgetLength: function (jqObj) {

var elem = _GetDomObj( jqObj);

var sType = elem.type;
switch (sType) {
case _validTagTypeEnum.text:
case _validTagTypeEnum.hidden:
case _validTagTypeEnum .password:
case _validTagTypeEnum.textarea:
case _validTagTypeEnum.file:
var val = jqObj.val();
var initConfig = $.formValidator.getInitConfig(elem.settings) [0].validatorgroup);
len = initConfig.wideword(val) : val.length;
case _validTagTypeEnum.radio:
len = $ ("input[type='" sType "'][name='" jqObj.attr("name") "']:checked").length;
break
case _validTagTypeEnum; select_one:
case _validTagTypeEnum.select_multiple:
len = jqObj.children(":selected").length;
break;
}

2. オリジナルのバージョンでは、検証ラベルのオブジェクトではなく、検証ラベルの ID が各メソッド間で渡されるため、各メソッドの ID に基づいて検証ラベルのオブジェクトを取得する必要がなくなりました。メソッドを使用して、コードの実行速度とパフォーマンスを向上させます。
3. オリジナルのバージョンでは、検証成功、エラーなどのプロンプトスタイル名はプラグイン内で制限されています。たとえば、エラープロンプトスタイル名は次のようになります。このプラグインを使用するときは、プロンプト内の各プロンプトスタイルの名前に注意してください。また、使用すると不快なスタイルの重複や競合を避けるためにも注意してください。本当に優れたプラグインは、js とスタイル (ユーザーが設定する必要がある) を完全に分離する必要があります。これはプログラミングにおける「疎結合」に似ていますが、この方法でのみ、js とスタイルは相互に依存し、より良いものになります。ユーザーのニーズに適応するため、ユーザーがプラグインで各プロンプトスタイルを設定できるようにしました (メソッドのパラメーターオブジェクトの属性として)。メインコードは次のとおりです。 >

コードをコピー

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

//ヒントスタイル列挙
var _tipCssEnum =
{
//(ajax) 読み込み処理
loadCss: "loadCss",
//フォーカス取得時 Style
focusCss: "focusCss",
//Prompt [空のプロンプトの場合] ---これが設定されていない場合は、errorCss を使用します
noticeCss: "noticeCss",
//失敗またはエラー [形式の場合]エラー、正規表現検証]---
errorCss: "errorCss",
//Success を設定する必要があります---
successCss: "successCss",
//デフォルト状態を設定する必要があります---
defaultCss: "defaultCss"
};
initConfig: function (controlOptions) {
var settings =
{
debug: false,/ / デバッグモードかどうか
validatorgroup: "1",//検証グループ
alertmessage: false,//検証プロンプトが直接ポップアップするかどうか
validobjectids: "",//検証オブジェクトコレクション
focusvalid: false,
onsuccess: function () { return true; }, //検証が成功した後の処理メソッド、return true|false (フォーム検証を追加したり、フォームの送信を阻止したりできます)
onerror: function () { } ,
filterInputStrFun: function (str) { return FilterInputOper.FilterInputStr(str) }, //入力文字列をフィルタリングするメソッド [設定可能]
isformpost: false, //フォーム送信かどうか (デフォルト: false) ——非フォーム送信、通常は ajax 送信、true——フォーム送信)
submitonce: false,//検証に合格した直後にフォームを送信するかどうか
submitbutton: null,//送信ボタン ID またはオブジェクト
getformdata: null, //function (formdata) { } (検証に合格した後) 入力フォームの値を取得します - このメソッドは isformpost=false の場合にのみ呼び出されます
//検証プロンプトの表示設定 (デフォルト: デフォルト)設定による)
tipshow: "default",
formid: "", //フォームの ID またはオブジェクトを確認します
tidymode: false, //ライトモード
errorfocus: true,
wideword : true,
//検証プロンプトのスタイル設定 (グローバル)
tipcss:
{
//(ajax) 読み込み処理
loadCss: "",
//フォーカス取得時 Style
focusCss: "",
//Prompt
noticeCss: "",
//Success
successCss: "",
//Failure
errorCss : " ",
//デフォルト状態
defaultCss: ""
}
};
controlOptions.tipcss = controlOptions.tipcss || {} ;
//設定全体をマージします (ディープコピー)
$.extend(true, settings, controlOptions);
if (!settings.isformpost) {
if (!settings.submitbutton ) {
alert("送信ボタンを空にすることはできません! ");
return;
}
_GetJqObj(settings.submitbutton).click(function () {
var pageIsValid = $.formValidator.pageIsValid(settings.validatorgroup);
if ( pageIsValid && _IsFunction(settings.getformdata)) {
var formData = _GetFormData(settings.filterInputStrFun)
settings.getformdata(formData)
}
settings.tipshow = settings.tipshow || "default";
//合理化モードの場合、エラーが発生すると最初のエラーコントロールはフォーカスされません
if (settings.tidymode) {
settings.errorfocus = false;
}
if (settings.formid) {
_GetNodeById(settings.formid).submit(function () {
//フォーム送信でない場合はブロックフォームを送信
return settings.isformpost ? $.formValidator.pageIsValid(settings.validatorgroup) : false;
}
if (_jQuery_formValidator_initConfig_Array == null) {
_jQuery_formValidator_initConfig_Array = new Array ();
}
_jQuery_formValidator_initConfig_Array.push(settings);
}
//ヒント情報を設定します
setTipState: function (elem, showCssEnum, showmsg) {
var settings0 = elem .settings[0];
var initConfig = $.formValidator.getInitConfig(setting0.validatorgroup);
if (initConfig.alertmessage && showmsg) {
alert(showmsg); 🎜> }
var jq_tipObj = settings0.tipJqObj;
vartip_IsNull(jq_tipObj);
showmsg = showmsg ||
if (initConfig .tidymode) {
//プロンプト情報を保存
elem.Tooltip = showmsg;
if (showCssEnum != _tipCssEnum.errorCss && showCssEnum != _tipCssEnum.noticeCss)
jq_tipObj.hide() ;
}
jq_tipObj.removeClass();
//ヒントのスタイルを設定します
var showClass = settings0.tipcss[showCssEnum]
//noticeCss が設定されていない場合は、errorCss を使用します。 >if (String.isNullOrEmpty(showClass) && showCssEnum == _tipCssEnum.noticeCss) {
showCssEnum = _tipCssEnum.errorCss;
showClass = settings0.tipcss[showCssEnum];
if (!String .isNullOrEmpty (showClass)) {
//現在のヒントラベル表示のスタイルを保存します (列挙値)
elem.showcssenum = showCssEnum;
jq_tipObj.addClass(showClass); >jq_tipObj.html(showmsg);
}
}

4. より多くのニーズに応え、機能と使いやすさを向上させるために、次のようないくつかのプロパティを initConfig 構成オブジェクトに追加しました。
filterInputStrFun: function (str) { return FilterInputOper.FilterInputStr(str);入力文字列をフィルタリングするメソッド [設定可能] - 入力文字列をフィルタリングするニーズを満たすため
Isformpost: false, //フォーム送信かどうか (デフォルト: false - 非フォーム送信、通常は ajax Submit, true - フォーム送信) - Ajax 送信とフォーム送信のニーズを満たすため
Getformdata: null, //function (formdata) { } (検証後) 入力フォーム値を取得します - isformpost=false のみ
ヒントショー: "default", //検証プロンプトの表示設定 (デフォルト: 設定に応じたデフォルト) - ID またはカスタム jQuery 検索 (検索) メソッドに基づいて、検証プロンプトラベルオブジェクトの検索方法を設定します。

プラグインの使用方法は次のとおりです。

コードをコピーしますコードは次のとおりです。

您好，欢迎来到山水檀溪！
退出

进入楼盘首页