我有一个表单,其中包含三个数字输入字段,分别对应于社会安全号码 XXX-YY-ZZZZ
的 3 个数字部分,例如:
<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="ssn1" id="ssn1" maxlength="3" size="4">
<input name="ssn2" id="ssn2" maxlength="2" size="4">
<input name="ssn3" id="ssn3" maxlength="4" size="4">
<br />
<input class="submit" type="submit" value="submit" />
</fieldset>
</form>
当没有社会安全号码时,我的错误消息会显示在每个文本字段之后。有没有办法将这些错误消息分组,以便出现 3 个相邻的文本框,然后只显示一条错误消息?
最佳答案
我不会使用 3 个不同的社会保障号字段,而是使用一个屏蔽为 ###-##-#### 格式的字段。
然后,您可以让单个验证规则点击单个输入框。
$("#ssn").mask("999-99-9999");
这是一个代码示例,使用 SSN 的单个字段以及验证插件和屏蔽输入插件...
<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>
关于jQuery - Validate() 并对相似的表单项进行分组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/982027/