Question

我遇到了jQuery验证问题，可以使用一些建议。

有没有办法可以验证此表单中的三个电话号码字段，同时只有一个组的错误消息？非常感谢任何帮助。

表格

<form id="mForm" name="form">
<div class="field right">
  <label class="labelStd" id="phoneNumber">Phone Number*</label>
  <input name="txtPhone1" type="text" maxlength="3" id="txtPhone1" class="small-phone" name="txtPhone1" Onchange="Tab(this, 'txtPhone2');" />
  <input name="txtPhone2" type="text" maxlength="3" id="txtPhone2" class="small-phone" name="txtPhone2" Onchange="Tab(this, 'txtPhone3');" />
  <input name="txtPhone3" type="text" maxlength="4" id="txtPhone3" class="small-phone" name="txtPhone3" />
</div>

<button type="submit" id="btn_submit" class="button-black right">SEND</button>
</form>

脚本（使用jquery验证）

<script type="text/javascript">
$("#mForm").validate({

onfocusout:false,
focuseInvalid:false,
onkeyup:false,

rules: {

    txtPhone1:{
            required: true,
            digits: true,
            minlength: 3,
            maxlength: 3
        },
    txtPhone2:{
            required: true,
            digits: true,
            minlength: 3,
            maxlength: 3
        },
    txtPhone3:{
            required: true,
            digits: true,
            minlength: 4,
            maxlength: 4
        }
    },

messages: {

    txtPhone1: "Your phone number is required.",
    txtPhone2: "Your phone number is required.",
    txtPhone3: "Your phone number is required."
}


  });

  $("#mForm").submit(function(){

if($(this).valid()){

form.submit();

}

else{ }

 });
</script>

Answer 1

您需要使用groups option ...

指定错误消息的分组。一组由任意组成组名称作为键，空格分隔的元素名称列表为价值。使用errorPlacement控制组消息的位置放置。

groups:  {
    someArbitraryName: "txtPhone1 txtPhone2 txtPhone3"
}

通用演示：http://jsfiddle.net/3RFsa/

<强>旁注：

关于你的submit处理程序......

$("#mForm").submit(function(){
    if($(this).valid()){
        form.submit();
    }
...

这完全是多余的和不必要的，所以我会完全删除它。默认情况下，如果/有效，插件将仅自动提交表单。除了submit()之外，如果您还想做其他事情，可以使用插件的submitHandler回调函数。如果您需要在表单验证失败时执行某些操作，请使用插件的invalidHandler回调函数。

多个字段的一条验证消息

1 个答案: