-2

到目前为止，我发现这个插件很好Jquery Form Validator到目前为止它已经满足了我的所有要求，但我坚持为用户设置验证，以便仅输入美国手机号码格式，例如1-(XXX)-XXX-XXXX。它应该只允许输入这个数字，否则它不应该接受并且应该显示表单验证错误。

我已经研究过但找不到任何教程或演示代码来展示如何实现这个特定的东西，因此我不得不提出这个问题。

如果可能的话，有人可以指导我或向我展示一些代码如何使用html 标签（即）中的data-*属性<input data-validation="creditcard" data-validation-allowing="visa, mastercard, amex">或借助此插件的任何其他方式来实现这一点。

我正在尝试使用此配置回调，但我有点困惑如何使用它，因为我有多个表单，并且我只将此代码放在我的common.js文件中，用于所有适用于所有表单的表单。

$.validate({
             modules : 'security, file'
        });

所以我想要一些像 common data-*属性（如果它可用）这样的东西，它可以以特殊的 html 形式工作，这对我来说是可行的，因为我不需要像$.validate({form : '#LoginForm'});上面那样基于不同的形式键入不同的代码，常见的方法将是对我来说可行..

有人可以帮我实现这件事吗？

任何帮助将不胜感激。

谢谢。

4

3 回答 3

2

最终，感谢@mplungjan，他为我提供了一个链接并向我展示了如何完成此操作的方法，最终我轻松地解决了这个问题。

我只是去了图书馆默认验证自定义，我看到他们实际上提供了在旅途中进行正则表达式验证的设施..

我搜索了正则表达式来检查美国手机号码电话号码正则表达式美国

然后在找到一个可以使用的正则表达式之后，我使用了这个 HTML 代码，

<input name="user_mobile_no" class="form-control error" placeholder="Mobile No." 
data-validation="required custom" 
data-validation-error-msg-required="Please Enter Mobile Number" 
data-validation-regexp="\D*([2-9]\d{2})(\D*)([2-9]\d{2})(\D*)(\d{4})\D*" 
data-validation-error-msg-custom="Invalid Mobile Number (i.e. +1 XXX-XXX-XXXX)" 
maxlength="50" id="user-mobile-no" value="+1 215-555-1212" 
style="border-color: rgb(185, 74, 72);" type="text">

瞧，它的工作。

请注意我在上面放置的这些行，需要在此处放置自data-validation="required custom" 定义以进行自定义验证。

然后在我放

data-validation-regexp="\D*([2-9]\d{2})(\D*)([2-9]\d{2})(\D*)(\d{4})\D*"

它检查有效的电话号码，最后但并非最不重要的是，我已经放置了两个不同的验证错误消息，以向用户显示所需 data-validation-error-msg-required="Please Enter Mobile Number" 和无效的号码 data-validation-error-msg-custom="Invalid Mobile Number (i.e. +1 XXX-XXX-XXXX)"。

谢谢小伙伴们的支持。我希望它可以帮助需要处理类似事情的人。非常感谢。

谢谢你。

于 2016-09-29T12:24:56.267 回答
1 

/*
It works for these number formats:
1-234-567-8901
1-234-567-8901 x1234
1-234-567-8901 ext1234
1 (234) 567-8901
1.234.567.8901
1/234/567/8901
12345678901
1-234-567-8901 ext. 1234
(+351) 282 433 5050
*/

jQuery.validator.addMethod("usPhoneFormat", function (value, element) {
    return this.optional(element) || /^\(*\+*[1-9]{0,3}\)*-*[1-9]{0,3}[-. /]*\(*[2-9]\d{2}\)*[-. /]*\d{3}[-. /]*\d{4} *e*x*t*\.* *\d{0,4}$/.test(value);
}, "Enter a valid phone number.");


$(document).ready(function(){   
  $("#sampleForm").validate({
    rules: {
      phoneNumberRegEx: {
        usPhoneFormat: true,
        required: true
      }
    },
    submitHandler: function (form) {
      alert("submitted.");
    }
  });
  $(".phone").mask("0-000-000-0000", {placeholder: "_-___-___-____"});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="http://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
<form id="sampleForm" method="POST">
    <fieldset>
        <label for="phoneNumberRegEx">Phone: </label>
        <input type="text" id="phoneNumberRegEx" name="phoneNumberRegEx" class="phone" />
    </fieldset>
    <input type="submit" value="Submit" />
</form>

于 2016-09-29T12:39:19.553 回答
0

如果您想使用特定系列代码进行高级验证，您可以尝试使用此包中的数据https://www.npmjs.com/package/dialcodes

于 2016-10-25T21:56:13.043 回答