2

私の質問 私のページには上記のフォームがあります。jquery 検証エンジンを使用してフォームを検証したいのですが、検証方法と含めるファイルを教えてください。今、私は頭の中に jquery 検証エンジンを含めました。検証エンジンをトリガーし、テキスト フィールドの onblur のエラー メッセージを表示する方法を知りたいだけです。事前にどうもありがとうございます。以下のコードを見つけてください。

<script src="../js/jquery-1.6.min.js" type="text/javascript"></script>
<script src="scripts/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
<script src="scripts/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

    jQuery(document).ready(function(){
        // binds form submission and fields to the validation engine
        $('#myForm').validationEngine('validate');
    });


</script>
<form class="container" id="myForm" method="post" action="">
    <div>
        <span>Field is required : </span>
        <label for="Firstname">Firstname</label>
        <input type="text" class="validate[required] text-input" id="name" name="Firstname"/>
    </div>
    <div>
        <span>Field is required : </span>
        <label for="name">middlename</label>
        <input type="text" id="name" name="middlename" class="validate[required] text-input"/>
    </div>
    <div>
        <span>Field is required : </span>
        <label for="name">lastname</label>
        <input type="text" id="name" name="lastname" class="validate[required] text-input"/>
    </div>
</form>
4

4 に答える 4

10

jquery コードを次のように変更します。

<script type="text/javascript">

   jQuery(document).ready(function(){
       // binds form submission and fields to the validation engine
       $('#myForm').validationEngine();
   });

</script>

次に、いくつかのクラスをフォーム フィールドに追加します。たとえば、次のようになります。

これは入力テキストであり、必須です:

<input type='text' class="validate[required] text-input">

または、これは電子メールのみの入力テキストです。

<input type='text' class="validate[required,custom[email]] text-input">

ボタンを配置し、その Click イベントで次のような JavaScript 関数を呼び出します。

function myValidation()
{

    if ($('#myForm').validationEngine('validate'))   
    { 
        //do somthing here beacause your form is valid
    }
}

さらにヘルプが必要な場合は、私にコメントしてください

于 2011-12-25T09:23:57.530 に答える
7

検証エンジンの使用方法については、このjQuery.validationEngineを参照してください。

カスタム ルールの作成については、この既存の質問jQuery Validate Plugin - How to create a simple custom rule? を参照してください。

于 2011-12-25T09:34:39.677 に答える
3

すべてがうまくいき、それを正しく行うと、このメソッドを呼び出すだけで、フォームのすべてのフィールドを検証できます

$('#myForm').validationEngine('validate');

これは、フォームのすべてのフィールドが正しい場合は true を返し、そうでない場合は false を返します

于 2011-12-25T08:49:00.720 に答える