在动态生成的元素上使用jquery validate插件添加验证规则

前端之家收集整理的这篇文章主要介绍了在动态生成的元素上使用jquery validate插件添加验证规则前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图在从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
        });
    });
})

它似乎只是在第一个元素中识别规则,但其他元素在没有验证的情况下通过.

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

有什么建议么?

解决方法

检查一下:

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;
    });
});

on jsfiddle

原文链接:https://www.f2er.com/jquery/181204.html

猜你在找的jQuery相关文章