JQuery 拡張プラグイン Validate - radio、checkbox、select_jquery の 6 つの検証

効果は次のとおりです。

この問題を解決する方法は、エラー メッセージを特定の場所に指定することです。サンプル コードは次のとおりです。 >

コードをコピーします コードは次のとおりです。 >jQuery.validator.addMethod( "regex", //addMethod の最初のパラメータ: メソッド名 function(value, element, params) { //addMethod の 2 番目のパラメータ: 検証メソッド, value, element検証対象、パラメータ) var exp = new RegExp(params) //通常のオブジェクトをインスタンス化します。パラメータはユーザーによって渡された正規表現です。 return exp.test(value); }, "フォーマットエラー");

$(function() { $("#signupForm").validate(

{ rules: { txtPassword1: "required", //パスワード 1 は必須です

txtPassword2: { //パスワード 2 にはオブジェクト タイプを使用した説明が複数あります required: true, / / 必須、匿名メソッドにすることができます equalTo: "#txtPassword1", // パスワード 1 と等しい必要があります rangelength: [5, 10], // 5-10 の間の長さ regex: "^\w $" //カスタム検証ルールを使用します },

txtEmail: "email", //電子メールは合法である必要があります 性別: "required" }, messages: { //上記のエラー メッセージに対応します txtPassword1: "入力する必要があります",

txtPassword2: { required: "入力する必要があります", equalTo: " パスワードが一致しません"、 rangelength: "長さは {0} から {1} までである必要があります。"、 regex: "パスワードには数字、文字、アンダースコアのみを使用できます。" } },

//上記の例の新しい部分 errorPlacement: function(error, element) { //エラーメッセージの場所を指定 if (element.is(':radio' ) || element.is(':checkbox')) { //ラジオまたはチェックボックスの場合 var eid = element.attr('name') //要素の name 属性を取得します エラー.appendTo( element.parent()); // 現在の要素の親ノードの後にエラー メッセージを追加します } else { error.insertAfter(element)},

debug: false, //true に変更するとフォームは送信されません submitHandler: function() { alert("送信開始") } } ); }); 男性 女性

実行結果は次のとおりです:

さらに: debug:true がパラメータに追加された場合、それはフォームのデバッグにのみ使用され、サーバーに送信されません。submitHandler: function() {} はフォームが送信される前にいくつかの操作を実行します。サーバーへの接続; Ajax 検証にリモートを使用できますが、小さなバグがあるようです; ASP.NET を validate と組み合わせて使用すると、いくつかの問題が発生する可能性があります。netizen のブログ投稿を参照してください。

ソースコードのダウンロード