logo标签列表

JQuery验证器插件——电话验证

jqueryhtmlformsvalidationjquery-validate
5

我在使用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有关吗？有人遇到过这个问题吗？有人知道为什么会发生这种情况吗？如果需要，以下是整个jquery验证代码。

你能进行一些测试，看看哪些值有问题吗？是特定的数字范围还是带有某个字符的条目？ - DACrosby
@Richard，我猜问题出在你的服务器端代码上，请先检查一下，在向数据库插入数据时。 - Kundan Singh Chouhan
3个回答
17
您正在使用phoneUS验证方法来验证电话号码，该方法接受以下两个输入（示例）：
  • 949-101-2020
  • 9491012020
由于第一个示例被认为是有效的，您尝试将其直接存储到数据库中，而且似乎您正在使用整数或数字列。许多数据库，包括MySQL，将尝试通过简单地删除第一个非数字字符后面的所有内容来强制将该值转换为整数。我始终建议使用varchar字段来存储电话号码，因为这些数字实际上没有数值含义（即您永远不会进行加法/减法计算）。
此外，仅仅依赖客户端验证是一个坏主意。您始终需要在服务器端验证数据，因为很容易欺骗客户端验证（无论是恶意的还是不恶意的）。
完美，那就是问题所在。加上了一些服务器端验证，并将列更改为varchar。工作正常，非常感谢。你应该得到好评！ - Richard
3
以下是电话模板的自定义验证代码：
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");

例如: 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类添加到输入框即可 例如：+41748987145

这种方法是jquery验证的扩展。通过这种方式，您可以定义自己的自定义规则。相信我，在某些情况下您需要它们。

1

如果数据库字段保存的是整数，而你发送的内容是像“987-123-1223”这样的字符串，根据你的数据库引擎，只有前面的数字会被存储。

我自己也遇到过这个问题！你可以在服务器端使用简单的字符串替换方法来解决它！

如果事实如此，那么Richard应该使用字符串类型来存储电话号码，因为前导零可能很重要，但在存储到数字字段时将丢失。 - William Lawn Stewart
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接