0

我正在尝试使用这个 jQuery 插件http://bassistance.de/jquery-plugins/jquery-plugin-validation所以我可以验证我正在制作的表格。但它似乎没有验证电话字段。谁能帮我理解我做错了什么？

到目前为止，这是我的代码

<script type="text/javascript">
 var validator
 jQuery(document).ready(function() {
     validator = jQuery("#participateform").validate();
 });

function sendRequest(){ 
        var validform=validator.form();       
        if(validform)
        {
            alert("Form is valid");
        }
}
</script>

<form id="participateform" >
    <div class="table">
        <div class="tr">
            <div class="td">fullname</div>
            <div class="td">
                <input type="text" value="" id="fullname" name="fullname" class="required" />
            </div>
        </div>
        <div class="tr">
            <div class="td">your e-mail </div>
            <div class="td">
                <input type="text" value="" id="e-mail" name="e-mail" class="required email" />
            </div>
        </div>
        <div class="tr">
            <div class="td">area</div>
            <div class="td">
                <select id="area" name="area"></select>
            </div>
        </div>
        <div class="tr">
            <div class="td">Phone 1</div>
            <div class="td">
                <input type="text" value="" id="phone" name="phone" class="required phone"/>                
            </div>
        </div>
        <div class="tr">
            <div class="td">Phone 1</div>
            <div class="td">
                <input type="text" value="" id="phone2" name="phone2" />
            </div>
        </div>

    </div>

    <input type="button" id="btnsubmit" value="submit" onclick="sendRequest()"> 
</form>
4

4 回答 4

2

什么样的验证在手机上失败？

快速浏览一下源代码会发现缺少 phone 作为验证类。

编辑

您需要添加自定义规则：

$(document).ready(function(){

  $.validator.addMethod("phone", function(value, element) {
    //Any code that will return TRUE or FALSE
    return /^(\d+){10}$/.test(value);
  },
  "Error message");

});
于 2012-08-14T12:35:11.330 回答
2

该库的源代码建议该库使用以下电话验证规则：

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");

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

jQuery.validator.addMethod('mobileUK', function(phone_number, element) {
    phone_number = phone_number.replace(/\s+|-/g,'');
    return this.optional(element) || phone_number.length > 9 &&
        phone_number.match(/^((0|\+44)7(0|4|5|6|7|8|9){1}\d{2}\s?\d{6})$/);
}, 'Please specify a valid mobile number');

//Matches UK landline + mobile, accepting only 01-3 for landline or 07 for mobile to exclude many premium numbers
jQuery.validator.addMethod('phonesUK', function(phone_number, element) {
    phone_number = phone_number.replace(/\s+|-/g,'');
    return this.optional(element) || phone_number.length > 9 &&
        phone_number.match(/^(0[1-3]{1}[0-9]{8,9})$/) || phone_number.match(/^(07[5-9]{1}[0-9]{7,8})$/);
}, 'Please specify a valid uk phone number');

所以不要这样做：

<input type="text" value="" id="phone" name="phone" class="required phone"/>

试试这个美国电话号码：

<input type="text" value="" id="phone" name="phone" class="required phoneUS"/>

或者这个英国电话号码：

<input type="text" value="" id="phone" name="phone" class="required phoneUK"/>

或者这是一个英国手机号码

<input type="text" value="" id="phone" name="phone" class="required mobileUK"/>
于 2012-08-14T12:41:52.507 回答
1

试试看这里，似乎你应该使用另一种内置的验证方法，比如digits()或phoneUS()

于 2012-08-14T12:39:28.393 回答
1

如前所述，没有电话验证。您可以使用 jQuery.validator.addMethod() 来定义自己的（甚至通过正则表达式或您想要的任何方式），它有据可查。

另请参阅： http ://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.js

于 2012-08-14T12:40:15.600 回答