2

JSFiddleを作成しました。入力要素を含む div を動的に追加しています (実際のアプリには複数のフィールドがあります)。[送信] をクリックすると、動的に追加されていない最初の HTML 要素が検証されます。動的要素に一意の ID があることを確認しています。

何かご意見は？

$('#submit').click(function (e) {    
    e.preventDefault();
    validator = $("#myForm").validate({
        rules: {
            name: "required"
        }
    });
    $("#myForm").valid();
});

更新:- 奇妙なことに気付きました。新しい入力要素を追加し、この新しい入力にフォーカスして送信をクリックすると、firebug で、jquery がエラー メッセージを表示せずにこの入力タグに「class=error」を自動的に追加することがわかります。そして、2 番目の入力に何かを書き込もうとすると、最初の入力からエラー メッセージが削除されます。

4

1 に答える 1

2

マークアップをこれに変更します（送信ボタンはフォームタグの外側にありました）

<form id="myForm">
    <div id="section">
        <input type="text" name="name" class="required"/>
    </div>
    <input type="button" id="add" value="add" />
    <input type="submit" id="submit" value="submit" />
</form>

そして、あなたのjQueryの中にはすでにこれがあります

var count = 0;
$("#myForm").validate();
$('#add').on('click', function () {
    var section = $('#section').clone(false).attr('id', function () {
        return 'section' + (count);
    });
    section.find('input').attr('name', function () {
        return 'name' + (count);
    });
    section.find('label').attr('for', function () {
        return 'name' + (count);
    });
    section.insertAfter('#section');
    count++;
});

これにより、必要なものが得られます。

  1. 一意の名前を持つ各入力
  2. 対応する入力フィールドに一致するラベル

ここでフィドルを更新しました

于 2013-05-30T13:32:52.013 に答える