jQuery - 验证（）并对类似的表单项进行分组

Question

我有以下表格：

http://fuzzysiberians.com/app4.cfm

如果没有社会安全号码，则会在每个文本字段后显示我的错误消息。有没有办法将这些错误消息分组，以便彼此相邻有3个文本框，然后只显示一条错误消息？

Answer 1

我没有为社会安全号码提供3个不同的字段，而是使用了一个为### - ## - ####格式屏蔽的字段。

然后，您可以将单个验证规则命中到单个输入框。

jQuery Masked Input Plugin

   $("#ssn").mask("999-99-9999");

下面是使用SSN的单个字段以及validate插件和屏蔽输入插件的代码示例...

<form id="myForm">
<fieldset>
    <legend>My Sample Form</legend>
    <label><strong>Name:</strong></label><br />
    <input name="name" id="name" />
    <br />
    <label><strong>SSN:</strong></label><br />
    <input name="ssn" id="ssn" />
    <br />
    <input class="submit" type="submit" value="submit" />
</fieldset>
</form>

<script language="javascript">
    jQuery(function($) {
        $("#ssn").mask("999-99-9999");
        // validate signup form on keyup and submit
        $("#myForm").validate({
            rules: {
                name: "required",
                ssn: "required",
            },
            messages: {
                name: "Please enter your name!",
                ssn: "Please enter your ssn!"
            }
        });

    });
</script>

Answer 2

为什么不将SSN作为单个字段？目前，ssn的每个部分都有3个单独的文本字段。

或者，有各种蒙版编辑字段，可以自动将破折号添加到用户的字段中。但是这种情况下，用户习惯于输入他们的全部号码，因为他们已经开始分批输入。