0

次のフィドルを参照してください。

<form action="http://someurl.com/" id="test-form-1" method="post" name="test-form-1">
  <input class="test-domainurl" type="url"> <input class="test-order-button" type="submit" value="Continue to Order">
</form>
<form action="http://someurl.com/" id="test-form-2" method="post" name="test-form-2">
  <input class="test-domainurl" type="url"> <input class="test-order-button" type="submit" value="Continue to Order">
</form>


jQuery(document).ready(function($) {
    $(".test-order-button").click(function() {
        $("#test-form-1").validate({});
        $("#test-form-2").validate({});
        $(".test-domainurl").rules("add", {
            required: true
        });
    });
});

http://jsfiddle.net/vak87/

最初のフォームのみが検証される理由がわかりません。

アイデアや提案はありますか？

ありがとう

4

3 に答える 3

1

コードがIE7およびIE8で機能しないというコメントについて...

1)イベント ハンドラー.validate()で囲む必要はまったくありません。メソッドはプラグインの初期化のみであり、テスト メソッドではありclickません.validate()。このメソッドは、DOM の準備が整ったときに1 回だけ呼び出す必要があり、その後の呼び出しは常に無視されます。クリックはプラグインによって自動的にキャプチャされるため、検証テストが実行されます。.validate()

.rules()2)複数の要素を含む jQuery オブジェクトにメソッドをアタッチするときは、それを jQuery 内に囲む必要があります.each()。それ以外の場合、.rules()メソッドは最初に一致した要素にのみルールを割り当てます。

これが正しい方法です...

jQuery(document).ready(function($) {

    $("#test-form-1").validate({});  // intialize plugin on first form

    $("#test-form-2").validate({});  // intialize plugin on second form

    $(".test-domainurl").each(function() {  // select applicable inputs
        $(this).rules("add", {              // apply the rule to each selected input
            required: true
        });
    });

});
于 2013-08-06T18:08:44.610 に答える
0

検証プラグインを使用したことはありませんが、セレクターはプラグイン内の最初の一致に制限されていると思います。ルールを個別に追加するとうまくいくようです。

例：

jQuery(document).ready(function($) {
    $(".test-order-button").click(function() {
        $("#test-form-1").validate({});
        $("#test-form-2").validate({});
        $(".test-domainurl").each(function(index, el) {
            $(el).rules("add", {
                required: true
            });
        });
    });
});
于 2013-08-06T15:11:50.673 に答える