3

検証が発生すると、エラーがインラインではなくコンテナーに配置されるように、jquery 検証が機能しています。

必須ではないフィールドのいくつかに問題があります。コードについては、以下の jsfiddle を参照してください。簡単な概要は次のとおりです。

名前: 必須フィールド
コメント: 必須フィールド
URL: 必須ではありませんが、有効な URL を保証するために class='url'
電子メール: 必須ではありませんが、有効な電子メールを保証するために class='email'

再現するには:
値fooを電子メール フィールドまたは URL フィールドに入力し、タブをオフにし
ます。予想どおり、「電子メールが無効です」というエラーが表示されます。
フィールドに戻ってクリアし、タブでオフにし
ます エラーは消えますが、エラー コンテナーはまだそこにあります (上部に赤いアウトラインが表示されます)。

正規表現型の検証では、フィールドが必須でない場合、そこに値がない場合に検証を無視するようにリセットされていないようです。入って実際にエラーを修正すると、たとえばメール foo@foo.com を作成すると、すべて正常に動作します。

必須ではないフィールドに対して空白の値を有効として受け入れるように検証するにはどうすればよいですか?

jsfiddle リンク: http://jsfiddle.net/tjans/napf7/

4

3 に答える 3

2

使用するerrorClass

jQuery:

$(document).ready(function(){
    $("#commentForm").validate({
        wrapper: 'div',
        errorLabelContainer: '#jserror',
        errorClass: 'errorClass'
    });
  });​

次に、bordercss ルールをそのエラー クラスに移動します。必要に応じてスタイリング

#jserror {
    display:none;
}
.errorClass
{
  border:1px solid red;
}

デモ

于 2012-07-31T22:24:01.843 に答える
1

showErrorsメソッドを上書きして、独自の機能を提供できます。defaultShowErrors標準動作の を呼び出します。エラー オブジェクト ハッシュ内のエラーをチェックし、条件に応じてコンテナーを表示または非表示にする簡単なバージョンを作成しました。試してみてください。hasOwnPropertyこのソリューションを使用する場合は、オブジェクトの列挙を確認することもできます。

$("#commentForm").validate({
    wrapper: 'div',
    showErrors: function(errors){
        var hasErrors = false;
        for (var e in errors){
           hasErrors = true;
           break;
        }

        if(hasErrors) $(this.settings.errorLabelContainer).show();
        else $(this.settings.errorLabelContainer).hide();

        this.defaultShowErrors();
    },
    errorLabelContainer: '#jserror'
});
于 2012-07-31T22:19:22.560 に答える
0

検証プラグインでunhighlightセクションを使用します。

このjsFiddle http://jsfiddle.net/napf7/44/を確認してください

于 2012-08-02T06:31:46.887 に答える