JQuery Validator插件电话验证

时间:2012-11-21 21:16:42

标签: jquery html forms validation jquery-validate

我遇到了jquery验证器验证电话号码的问题。因此,在我有电话号码输入的表单中,我使用jquery的其他方法来验证电话。这是代码:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>stuff/title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.min.js"></script>
</head>
<body>
<script>
$(document).ready(function(e) {
    var val = $('#everything').validate({
        onkeyup: false,
        errorClass: "req_mess",
        ignore: ":hidden",
        rules: {
            phone: {
                required: true,
                minlength: 10,
                phoneUS: true
            }
        },
        messages: {
            phone: {
                required: "Please enter your phone number",
                phoneUS: "Please enter a valid phone number: (e.g. 19999999999 or 9999999999)"
            }
        }
    });
});
</script>
<form name="everything" id="everything" action="Private/Insert.php" method="post" style="display:none;" >
    Phone Number: <input type="text" name="phone" id="phone"/>
</form>
</body>
</html>

数据库最终看起来像这样的电话号码栏:
Phones
有时它会正确插入完整的电话号码(红色划线),但有时它只会插入3位数字。我不知道为什么。这可能与Internet Explorer有关吗?有人遇到过这个问题吗?有谁知道为什么会这样?以下是anyone needs it

的整个jquery验证码

3 个答案:

答案 0 :(得分:15)

您正在对电话号码使用phoneUS验证方法,该方法接受以下两个输入(示例):

  • 949-101-2020
  • 9491012020

由于第一个示例被认为是有效的,因此您尝试将其直接存储到数据库中,并且您似乎正在使用整数或数字列。许多数据库(包括MySQL)都会尝试通过简单地删除第一个非数字字符后的所有内容将该值强制转换为整数。我总是建议使用varchar字段来存储电话号码,因为这些数字实际上没有数字含义(即你永远不会加/减)。

此外,仅依靠客户端验证是一个坏主意。您总是希望在服务器端验证您的数据,因为欺骗客户端验证(恶意或非恶意)非常简单。

答案 1 :(得分:2)

  

以下是手机模板的自定义验证:

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

ex:123-123-1234

这是一种带有国家/地区前缀的格式:

  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(/^\+[0-9]{11}$/);
  }, "Please specify a valid phone number");
  

只需将phoneUS类添加到输入   ex +41748987145

此方法是jquery验证的扩展。这样您就可以定义自己的自定义规则。相信我,有些情况下你需要它们。

答案 2 :(得分:1)

如果数据库字段持有整数并且您正在发送类似“987-123-1223”的内容,则根据您的数据库引擎,只会存储第一个数字。

我自己已经遇到过这个问题了!您可以使用简单的字符串替换方法在服务器端修复它!