JQuery Validator 插件电话验证
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13502191/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery Validator Plugin Phone Validation
提问by Richard
I'm having issues with the jquery validator validating phone numbers. So in a form where I have an input for phone number, I use jquery's additional methods to validate the phone. Here's the code:
我在使用 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>
And the database ends up looking like this for the phone number column:
Sometimes it inserts the full phone number (crossed out in red) properly, but then sometimes it just inserts 3 digits. I don't know why. Is this something to do with Internet Explorer maybe? Has anyone come across this problem? Does anyone know why this is happening? Here's the entirety of the jquery validation code if anyone needs it
对于电话号码列,数据库最终看起来像这样:
有时它正确插入完整的电话号码(用红色划掉),但有时它只插入 3 位数字。我不知道为什么。这可能与 Internet Explorer 有关吗?有没有人遇到过这个问题?有谁知道为什么会这样?如果有人需要,这里是完整的 jquery 验证代码
回答by Abdullah Jibaly
You are using the phoneUSvalidation method for the phone number, which accepts both of the inputs below (examples):
您正在对电话号码使用phoneUS验证方法,该方法接受以下两个输入(示例):
- 949-101-2020
- 9491012020
- 949-101-2020
- 9491012020
Since the first example is considered valid, you attempt to store it directly into your database, and it seems that you are using an integer or number column. Many databases, including MySQL will attempt to coerce that value into an integer by simply dropping everything after the first non-numeric character. I always recommend using a varchar
field for storing phone numbers because the numbers don't really have a numeric meaning (ie you're never going to add/subtract).
由于第一个示例被认为是有效的,您尝试将它直接存储到您的数据库中,并且您似乎使用的是整数或数字列。许多数据库(包括 MySQL)将尝试通过简单地删除第一个非数字字符之后的所有内容来将该值强制转换为整数。我总是建议使用一个varchar
字段来存储电话号码,因为这些数字并没有真正的数字含义(即你永远不会加/减)。
Also, it's a bad idea to simply rely on client side validation. You always want to validate your data on the server side because it's very trivial to trick client side validation (maliciously or not).
此外,简单地依赖客户端验证是一个坏主意。您总是希望在服务器端验证您的数据,因为欺骗客户端验证(恶意与否)非常简单。
回答by Demian Flavius
Here is a custom validation for phone template:
这是电话模板的自定义验证:
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
例如:123-123-1234
And here is a format with country prefix :
这是带有国家/地区前缀的格式:
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");
Just add the phoneUS class to the imput ex +41748987145
只需将 phoneUS 类添加到输入 ex +41748987145
This method is an extension for jquery validation. In this way you define your own custom rules. Belive me, there are situations where you need them.
此方法是 jquery 验证的扩展。通过这种方式,您可以定义自己的自定义规则。相信我,有些情况下你需要它们。
回答by Lucas d. Prim
If the database field is holding integers and you're sending stuff like "987-123-1223", depending on your db engine only the first digits will be stored.
如果数据库字段保存整数并且您发送诸如“987-123-1223”之类的内容,则根据您的数据库引擎,只会存储第一个数字。
I've had this problem myself already! You can fix it on the server side using simple string replacement methods!
我自己已经有这个问题了!您可以使用简单的字符串替换方法在服务器端修复它!