如何验证格式*** *** ****的数字?

时间:2012-05-17 09:47:23

标签: jquery

我正在使用jquery,我正在尝试使用### ### ####格式验证手机号码或家庭电话号码。 #是数字的占位符。

目前我正在使用数字,但这会产生空格问题,并且我使用的是minlength 10,因为所有SA数字都是最小10位数。

我的代码看起来如下:

// Validation of Form
function validateForm() {
    $('#frmMain').validate({
        rules: { 
                 TelNumber: { required: true, number: true, minlength: 10 }
                },
        messages: {
                TelNumber: { required: 'Tel number Required' }
               },

        submitHandler: function (form) {
            $('#btnSubmit').click();

        }
    });
}

在这里,我找到了美国电话号码的附加信息,如果有人可以告诉我美国电话号码看起来如何,我可以编辑它:

jQuery.validator.addMethod("phoneUS", function(phone_number, element) {
    phone_number = phone_number.replace(/\s+/g, ""); 
    return this.optional(element) || phone_number.length > 9 &&
        phone_number.match(/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/);
}, "Please specify a valid phone number");

$("#myform").validate({
  rules: {
    field: {
      required: true,
      phoneUS: true
    }
  }
});

3 个答案:

答案 0 :(得分:2)

plugin author's page有一个指向“其他验证方法”包(hotlink to source)的链接,其中包含“phoneUS”验证规则。只需放下它就可以了。

如果要自定义可接受的模式,该文件还包含一个“模式”规则,允许您通过指定正则表达式进行验证。事实上,这就是“phoneUS”规则的工作原理:通过测试表达式的输入

/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/

答案 1 :(得分:1)

jQuery.validator.addMethod("phoneSA", function (phone_number, element) {
    phone_number = phone_number.replace(/\s+/g, "");
    return this.optional(element) || phone_number.length > 9 && 
        phone_number.match(/^(0-?)?(\([0-9]\d{2}\)|[0-9]\d{2})-?[0-9]\d{2}-?\d{4}$/); //(0-?) = 0, ([0-9]\d{2}\) = 3 digits from 0-9 , d{4} 4 didgets, $ end of number
}, "Please specify a valid phone number");

答案 2 :(得分:0)

这是我正在使用的脚本。根据您的需要修改代码。标识errorContainer用于显示您的错误消息。

<script type="text/javascript">
   $().ready(function() {
    $("#frmMain").validate({
        errorLabelContainer:'#errorContainer',
        showErrors: function(errorMap, errorList) {
            if(errorList.length)
            {
                $('#errorContainer').html(errorList[0]['message']);
            }
        },
            highlight:function(element,errorClass){
            $(element).parent('td').addClass('error');
            },
        unhighlight:function(element,errorClass){
                $(element).parent('td').removeClass('error');
        },
        rules: {
                        TelNumber: {
                required: true,
                number:true 
            }
                    },
            messages: {
                TelNumber: "Please enter a valid phone number",
            }
        });
   });
</script>

在尝试实现之前,请确保您的jQuery文件已成功加载并正常运行。

我建议尝试使用一些UI进行验证,这很容易实现。