1

我正在尝试在从 html 文字创建的输入上添加一些验证规则。

这是我的小提琴:http: //jsfiddle.net/idoxobi/HW4xY/1/

html:

<form id='form' method='post' >
    <div id='details'>
    </div>
    <a id='Add' href='javascript:void()'>Add</a>
    <br />
    <input type='submit' />
</form>

JavaScript:

$(document).ready(function() {
    $('#form').validate();
    var input = "<input type='text' class='item' name='item' />";
    $('#Add').click(function() {
        $('#details').append(input+'<br />');
        $('#details input:last').rules('add', {
            required: true
        });
    });
})

它似乎只在第一个元素中识别规则,但其他元素未经验证通过。

我是第一次使用这个插件,但是在论坛上每个人都说这应该可以正常工作。

有什么建议么?

4

2 回答 2

1

检查这个:

html:

<form id='form' method='post' >
    <div id='details'>
    </div>
    <a id='Add' href='#'>Add</a>
    <br />
    <input type='submit' />
</form>

js:

$(document).ready(function() {
    $('#form').validate();
    var i = 0;
    $('#Add').click(function() {

        var input = "<input type='text' class='item' name='item"+ i++ +"' />";
        $('#details').append(input+'<br />');
        $('#details input:last').rules('add', {
            required: true
        });

        return false;
    });
});

在 jsfiddle 上

于 2013-06-24T20:15:13.020 回答
0

这是因为每个输入字段名称都相同,并且已被@YD1m修复,我的方法如下:

$(document).ready(function() {
    $('#form').validate();
    var counter = 0;
    $('#Add').click(function() {
        counter++;
        $('#details').append("<input type='text' class='item required' name='item_" + counter + "' />" + '<br />');
    });
});
于 2013-06-24T20:24:25.470 回答