2

我创建了一个JSFiddle。我正在动态添加一个包含输入元素的 div（在实际应用中，有多个字段）。当我单击提交时，它只是验证第一个而不是动态添加的 HTML 元素。我确保动态元素具有唯一的 ID。

有什么想法吗？

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

更新：-我注意到一些奇怪的东西。在我添加一个新的输入元素，然后专注于这个新的输入并单击提交后，我可以在 firebug 中看到，jquery 会自动向这个输入标签添加一个“class=error”，而不会显示错误消息。如果我尝试向第二个输入写入内容，它会从第一个输入中删除错误消息。

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 onread 里面你有这个

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 回答