jQuery 验证多个表单

Question

我有两个没有 ID 的表单，我可以有更多，当我尝试使用 JQuery 验证插件进行验证时它是成功的，但消息总是放在第一个表单中。

<form class="myform" action="http://www.google.com">
    <input type="text" name="mytext"/>
    <button class="mybutton">Send</button>
</form>
<form class="myform" action="http://www.google.com">
    <input type="text" name="mytext"/>
    <button class="mybutton">Send</button>
</form>

JQuery 验证是

    <script>
        $(function () {
            $('.myform').validate({
                rules: {
                    mytext: 'required'
                },
                messages: {
                    mytext: 'Required field'
                }
            });
            $('.mybutton').click(function () {
                var form = $(this).closest('.myform');
                console.log("Action form is: " + form.attr('action'));
                form.valid();
            });
        });
    </script>

当我按下按钮时，我知道验证成功，因为当我按下第一个按钮时输出是Action form is: http://whosebug.com，而当我按下第二个按钮时输出是Action form is: http://www.google.com。

有什么方法可以将错误放在正确的形式中吗？

Example in JSFiddle

Answer 1

您可以使用 .each() 循环：

$('.myform').each(function(){
    $(this).validate({
        rules: {
            mytext: 'required'
        },
        messages: {
            mytext: 'Required field'
        }
    });
});

JSFiddle

jQuery 验证多个表单

jQuery Validate with multiples forms

jquery

jquery-validate