jQuery验证插件组：错误消息显示组中最后一个无效字段而不是第一个无效字段

在jQuery验证插件中使用组时，由于某些原因，如果两个字段都无效，则始终显示组中最后一个字段的错误消息。理想情况下，它应该显示组中第一个无效字段的错误消息

代码如下：

<form id="form1">
    <div>
        <label>Name</label>
        <input type="text" name="firstName" id="firstName" />
        <input type="text" name="lastName" id="lastName" />
    </div>
    <div>
        <input type="submit" value="Test" />
    </div>
</form>

理想情况下，单击“提交”按钮时，我希望播放以下场景：

两个字段均为空：“需要名字”

填写名字，姓氏为空：“姓氏为必填项”

填写姓氏，姓氏为空：“需要姓氏”

有人知道如何做到这一点吗

另一个我也在努力解决的问题是，如果我在用户完成每个字段时使用“success”函数来显示一个“valid”标签，那么它似乎忽略了字段是成组的这一事实。我只想在组中的两个字段都有效时显示“valid”消息

如果有人能帮助解决这些问题，那就太好了

谢谢

试试这个

$(function() {
    $('#form1').validate({
        messages: {
            firstName: {
                required: 'first name is required'
            },
            lastName: {
                required: 'last name is required'
            }
        },
        rules: {
            firstName: {
                required: true,
                lastName: {
                    required: true
                }
            }
        },
        groups: {
            fullName: 'firstName lastName'
        }
    });
});

---

谢谢，这有助于传递信息，但随后会破坏其他行为。如果我现在开始在first name字段中键入，我会得到以下JS错误（使用Chrome）：“Uncaught TypeError:无法调用undefined-jquery.validate.JS的方法‘call’”

$(function() {
    $('#form1').validate({
        messages: {
            firstName: {
                required: 'first name is required'
            },
            lastName: {
                required: 'last name is required'
            }
        },
        rules: {
            firstName: {
                required: true,
                lastName: {
                    required: true
                }
            }
        },
        groups: {
            fullName: 'firstName lastName'
        }
    });
});