6

Masked Inputプラグインを使用してマスクされ、Validation Plugin によって必須フィールドとしてマークされているテキスト ボックスがある場合、次の点を考慮してください。

マスクされたテキスト ボックスにフォーカスを置き、何も情報を入力せずにそのままにしておく (またはマスクを満たすのに十分な情報を入力しない) と、マスクされた入力プラグインによってすべてが削除され、空のテキスト ボックスが残ります。

$("#phoneNumber").mask("(999) 999-9999? x999999");
$("#sampleForm").validate({
    rules: {
        phoneNumber: "required"
    }
});

検証プラグインは、マスクされた入力プラグインの前にブラーイベントを発生させているようです。これにより、テキスト ボックスが検証に合格し (テキストが含まれているため)、マスクされた入力プラグインが開始され、テキストが削除されます。フィールドは、フォーカスを失ったらすぐに無効としてマークする必要があります。

正規表現バリデーターを使ってみました。近いですが、マスクされた入力プラグインがフィールドをクリーンアップする前にトリガーされるため、エラーが表示されるべきではないときにエラーが表示されます (ただし、ユーザーがフォームを送信しようとするとエラーは消えます)。

私もこれを試しました：

$('input').bind('unmasked.maskedInput', function () { $(this).valid(); });

これは機能しますが、バリデーターの初期動作にも干渉します。送信ボタンが押されるまでフィールドは検証されず、フォーカスを失ったときに検証されます。

私が直面している問題を表す jsFiddleをセットアップしました。

4

3 に答える 3

7

ひやワーキングデモ http://jsfiddle.net/2hdTn/

Cooleosだから、私がそれを正しく取得した場合、マスクされたプラグインは入力を削除していたので、混乱しました。:)

上記のサンプルデモでは、入力された番号が入力されたままになり、検証をフックすることができます。

ああ、これが役立つなら、答えを受け入れて賛成票を投じることを忘れないでください。

こちらもご覧ください：http： //view.jqueryui.com/mask/tests/visual/mask/mask.htmlもありますclearEmpty: false

おそらくマスク全体をオプションにする必要があり、bingoそれは機能します:)

（私が何かを逃した場合は私に知らせてください）

Jqueryコード

jQuery.validator.addMethod("usPhoneFormat", function (value, element) {
    return this.optional(element) || /^\(\d{3}\) \d{3}\-\d{4}( x\d{1,6})?$/.test(value);
}, "Enter a valid phone number.");

$.fn.ready(function () {

    $("#sampleForm").validate({
        rules: {
            phoneNumber: "required",
            phoneNumberRegEx: {
                usPhoneFormat: true,
                required: true
            },
            phoneNumberReg: "required"
        },
        submitHandler: function (form) {
            alert("submitted.");
        }
    });
    $(".phone").mask("?(999) 999-9999 x999999");
    //alert('foo');
});

​
于 2012-04-29T07:25:58.953 に答える
1 
phone_no:{
    icon: 'false',
    validators: {
        notEmpty: {
            message: 'Contact Phoneno is required'
        },
        regexp: {
            regexp: /^\d{3}\-\d{3}\-\d{4}$/,
            message: 'Please Enter Valid Phone number'
        }
    }
}

これを formvalidator に入力すると、完全に正常に動作します

于 2016-06-20T20:13:50.010 に答える